将表单中多个输入框的值复制并连接到一个输入字段 [英] copy and concatenate values of multiple input boxes in a form to one input field

查看:138
本文介绍了将表单中多个输入框的值复制并连接到一个输入字段的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

将多个输入框的值复制/复制并连接到一个

我有街道,城市,州和邮政的输入字段,第五个输入字段表示完整的地址。我正在尝试将完整的地址与上述四个字段的完整地址(作为分隔符连接在一起)填写在完整地址中。



以下是我所拥有的至今。第一个副本(街道地址),但我需要帮助来连接其他领域......



您可以在这里找到:
http://jsfiddle.net/subigya/PeVAj/



类型=text / javascript>

 < script type =text / javascript> $(b)
$('#street')。bind('keypress blur',function(){

$('#latlongaddress')。val($(this)。 val());

});
$ b $('#city')。bind('keypress blur',function(){

..需要帮助...

});

< / script>



< form method =postaction =#>

< div class =formitem>
< label for =name_of_salon>沙龙名称:< / label>
< input type =textid =name_of_salonname =name_of_salon/>
< / div>

< div class =formitem>
< label for =street>街道地址:< / label>
< input type =textid =streetname =street/>
< / div>

< div class =formitem>
< label for =city>城市:其中/标签>
< input type =textid =cityname =city/>
< / div>

< div class =formitem>
< label for =state>状态:< / label>
< select name =statesize =1>
< option value =AK> AK< / option>
< option value =AL> AL< / option>
< option value =AR> AR< / option>
< option value =AZ> AZ< / option>
< option value =CA> CA< / option>
< option value =CO> CO< / option>
< option value =CT> CT< / option>
< option value =DC> DC< / option>
< option value =DE> DE< / option>
< option value =FL> FL< / option>
< option value =GA> GA< / option>
< option value =HI> HI< / option>
< option value =IA> IA< / option>
< option value =ID> ID< / option>
< option value =IL> IL< / option>
< option value =IN> IN< / option>
< option value =KS> KS< / option>
< option value =KY> KY< / option>
< option value =LA> LA< / option>
< option value =MA> MA< / option>
< option value =MD> MD< / option>
< option value =ME> ME< / option>
< option value =MI> MI< / option>
< option value =MN> MN< / option>
< option value =MO> MO< / option>
< option value =MS> MS< / option>
< option value =MT> MT< / option>
< option value =NC> NC< / option>
< option value =ND> ND< / option>
< option value =NE> NE< / option>
< option value =NH> NH< / option>
< option value =NJ> NJ< / option>
< option value =NM> NM< / option>
< option value =NV> NV< / option>
< option value =NY> NY< / option>
< option value =OH> OH< / option>
< option value =OK>确定< / option>
< option value =OR> OR< / option>
< option value =PA> PA< / option>
< option value =RI> RI< / option>
< option value =SC> SC< / option>
< option value =SD> SD< / option>
< option value =TN> TN< / option>
< option value =TX> TX< / option>
< option value =UT> UT< / option>
< option value =VA> VA< / option>
< option value =VT> VT< / option>
< option value =WA> WA< / option>
< option value =WI> WI< / option>
< option value =WV> WV< / option>
< option value =WY> WY< / option>
< / select>
< / div>

< div class =formitem>
< label for =zip> Zip:< / label>
< input type =textid =zipname =zip/>
< / div>

< div class =formitem>
< label for =address_of_salon>完整地址:< / label>
< input type =textid =latlongaddressname =address/>
< / div>


< div class =formitem>
< input type =submitid =location_submitname =location_submitvalue =Add Locationclass =addBtn/>
< / div>


解决方案

使用 + for javascript concatenation:

  $('#latlongaddress')。val($('#street') .val()+''+ 
$('#city')。val()+','+
$('#state')。val()+''+
$('#zip')。val());

请参阅 jsFiddle


copy/duplicate and concatenate values of multiple input boxes to one

I have input fields for street, city, state and zip and the fifth one that says complete address. I am trying to have the full address[concatenated with , as a separator]with all the four aforementioned fields to be filled out on the complete address.

Here's what i have so far. The first one copies (street address) but i need help to concatenate the other fields...

You can Fiddle here: http://jsfiddle.net/subigya/PeVAj/

type="text/javascript">

<script type="text/javascript">

     $('#street').bind('keypress blur', function() {

        $('#latlongaddress').val($(this).val());

    });

    $('#city').bind('keypress blur', function() {

    ..need help ...

    });

</script>



<form method="post" action="#">

    <div class="formitem">
        <label for="name_of_salon">Name of Salon:</label>
        <input type="text" id="name_of_salon" name="name_of_salon" />
    </div>

    <div class="formitem">
        <label for="street">Street Address:</label>
        <input type="text" id="street" name="street" />
    </div>

    <div class="formitem">
        <label for="city"> City:</label>
        <input type="text" id="city" name="city" />
    </div>

    <div class="formitem">
        <label for="state">State:</label>
        <select name="state" size="1">
            <option value="AK">AK</option>
            <option value="AL">AL</option>
            <option value="AR">AR</option>
            <option value="AZ">AZ</option>
            <option value="CA">CA</option>
            <option value="CO">CO</option>
            <option value="CT">CT</option>
            <option value="DC">DC</option>
            <option value="DE">DE</option>
            <option value="FL">FL</option>
            <option value="GA">GA</option>
            <option value="HI">HI</option>
            <option value="IA">IA</option>
            <option value="ID">ID</option>
            <option value="IL">IL</option>
            <option value="IN">IN</option>
            <option value="KS">KS</option>
            <option value="KY">KY</option>
            <option value="LA">LA</option>
            <option value="MA">MA</option>
            <option value="MD">MD</option>
            <option value="ME">ME</option>
            <option value="MI">MI</option>
            <option value="MN">MN</option>
            <option value="MO">MO</option>
            <option value="MS">MS</option>
            <option value="MT">MT</option>
            <option value="NC">NC</option>
            <option value="ND">ND</option>
            <option value="NE">NE</option>
            <option value="NH">NH</option>
            <option value="NJ">NJ</option>
            <option value="NM">NM</option>
            <option value="NV">NV</option>
            <option value="NY">NY</option>
            <option value="OH">OH</option>
            <option value="OK">OK</option>
            <option value="OR">OR</option>
            <option value="PA">PA</option>
            <option value="RI">RI</option>
            <option value="SC">SC</option>
            <option value="SD">SD</option>
            <option value="TN">TN</option>
            <option value="TX">TX</option>
            <option value="UT">UT</option>
            <option value="VA">VA</option>
            <option value="VT">VT</option>
            <option value="WA">WA</option>
            <option value="WI">WI</option>
            <option value="WV">WV</option>
            <option value="WY">WY</option>
        </select>
    </div>

    <div class="formitem">
        <label for="zip">Zip:</label>
        <input type="text" id="zip" name="zip" />
    </div>

    <div class="formitem">
        <label for="address_of_salon">Full Address:</label>
        <input type="text" id="latlongaddress" name="address" />
    </div>


    <div class="formitem">
        <input type="submit" id="location_submit" name="location_submit" value="Add Location" class="addBtn" />
    </div>

解决方案

Use the + for Javascript concatenation:

$('#latlongaddress').val($('#street').val() + ' ' +
                         $('#city').val() + ', ' +
                         $('#state').val() + ' ' +
                         $('#zip').val() );

See the jsFiddle.

这篇关于将表单中多个输入框的值复制并连接到一个输入字段的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆