如何使用jquery从文本框中获取值

时间:2015-07-12 10:15:33

标签: javascript jquery



<div id="newPax">
            <div class="clearer"></div>
            <select name="pax[prefix]" id="pax_prefix" class="selectpicker" style=" width:125px;">
              <option value="">--</option>
              <option value="Mr" >Mr</option>
              <option value="Mrs" >Mrs</option>
              <option value="Ms" >Ms</option>
              <option value="Dr" >Dr</option>
              <option value="Justice" >Justice</option>
              <option value="Madam Justice" >Madam Justice</option>
            </select>
            <input type="text" name="pax[first_name]" id="pax_first_name" class="input-xmedium capL" placeHolder="First Name" value="">
            <input type="text" name="pax[last_name]" id="pax_last_name" class="input-xmedium capL" placeHolder="Last Name" value="">
            <div class="input-prepend"><span class="add-on"> + </span>
              <input type="text" name="pax[pax_no]" id="pax_no" class="input-xmini acenter" value="0" placeHolder="Pax#">
            </div>
            <br>
            <input type="text" name="pax[phone]" id="pax_phone" class="input-medium phoneFormat" placeHolder="Cell Phone" value="">
            <input type="email" name="pax[email]" id="pax_email" class="input-medium" placeHolder="Email" value="">
            <input type="email" name="pax[confirm_email]" id="pax_confirm_email" class="input-medium" placeHolder="Confirm Email" value="">
          </div>
          
&#13;
&#13;
&#13;

&#13;
&#13;
$('#pax_prefix').live( "click", function(){
  
   var pax_pre = $('#pax_prefix').val();
   $('#pax_first_name').live( "click", function(){
   var paxname = $('#pax_first_name').val();
   $('#pax_last_name').live( "click", function(){
   var paxlast = $('#pax_last_name').val();
   $('#pax_no').live( "click", function(){
   var paxn = $('#pax_no').val();

  $('#previewPax span').text(pax_pre + paxname + paxlast + paxn);
  $('#previewPax').show('fast');
});
});
});
});
&#13;
&#13;
&#13;

这里上面的jquery代码我想在用户进入阀门时从文本框中获取一些字段并使用jquery在同一页面上显示,请帮助我谢谢

1 个答案:

答案 0 :(得分:0)

&#13;
&#13;
$('#pax_prefix').change(function () {
    var pax_pre = $('#pax_prefix').val();
    alert(pax_pre);
});
$('#pax_first_name').click(function () {
    var paxname = $('#pax_first_name').val();
    alert(paxname);

});
$('#pax_last_name').click(function () {
    var paxlast = $('#pax_last_name').val();
    alert(paxlast);

});
$('#pax_no').click(function () {
    var paxn = $('#pax_no').val();
    alert(paxlast);
    $('#previewPax span').text(pax_pre + paxname + paxlast + paxn);
    $('#previewPax').show('fast');
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="newPax">
    <div class="clearer"></div>
    <select name="pax[prefix]" id="pax_prefix" class="selectpicker" style=" width:125px;">
        <option value="">--</option>
        <option value="Mr">Mr</option>
        <option value="Mrs">Mrs</option>
        <option value="Ms">Ms</option>
        <option value="Dr">Dr</option>
        <option value="Justice">Justice</option>
        <option value="Madam Justice">Madam Justice</option>
    </select>
    <input type="text" name="pax[first_name]" id="pax_first_name" class="input-xmedium capL" placeHolder="First Name" value="">
    <input type="text" name="pax[last_name]" id="pax_last_name" class="input-xmedium capL" placeHolder="Last Name" value="">
    <div class="input-prepend"><span class="add-on"> + </span>

        <input type="text" name="pax[pax_no]" id="pax_no" class="input-xmini acenter" value="0" placeHolder="Pax#">
    </div>
    <br>
    <input type="text" name="pax[phone]" id="pax_phone" class="input-medium phoneFormat" placeHolder="Cell Phone" value="">
    <input type="email" name="pax[email]" id="pax_email" class="input-medium" placeHolder="Email" value="">
    <input type="email" name="pax[confirm_email]" id="pax_confirm_email" class="input-medium" placeHolder="Confirm Email" value="">
</div>
&#13;
&#13;
&#13;