如何在javascript或jquery中的两个输入之间使用event .change

时间:2016-06-09 12:06:45

标签: javascript jquery html

我有两个问题。

首先:我输入了第一个,我首先输入值是数字输入然后输入第二个输入。但我希望它在我输入值时改变每一行

第二:按完后输入然后追加一行。但为什么连续追加不变。谁能帮助我?谢谢

代码html:

<form id="myform" name="data" method="post">
    <div>
        <input name="salary_one[]" class="a" value="" stt=""/>
        <input name="salary_two[]" class="" value=""/>

    </div>
    <div>
        <input name="salary_one[]" class="a" value="" stt=""/>
        <input name="salary_two[]" class="" value=""/>


    </div>
    <div>
        <input name="salary_one[]" class="a" value="" stt=""/>
        <input name="salary_two[]" class="" value=""/>


    </div>
    <div id="abc">
        <input name="salary_one[]" class="a nhay" value="" stt=""/>
        <input name="salary_two[]" class="" value=""/>

    </div>

    <br>

</form>

代码javascript:

    $('input[name="salary_one[]"]').change(function(){
    //$('input[name="salary_one[]"]').attr('stt',0);
    var tien=parseFloat($(this).val())*180;
    //$(this).attr('stt',1)
    //$('input[stt="1"] + input[name="salary_two[]"]').val(tien);

    $('input[name="salary_two[]"]').val(tien);
});

代码追加:

    $(document).on('keyup', '.nhay', function (e) {
    if (e.keyCode == 13) {
        $('.a').removeClass('nhay');
        $('#abc').append('<div><input name="salary_one[]" class="a nhay" value="" stt=""/><input name="salary_two[]" class="" value=""></div>');

    }

});

1 个答案:

答案 0 :(得分:0)

您需要使用元素之间的关系。 next()方法可用于立即跟随兄弟,然后设置文本。

&#13;
&#13;
$('#myform').on('input', 'input[name="salary_one[]"]', function() {
   var tien = parseFloat($(this).val()) * 180;
   $(this).next('input[name="salary_two[]"]').val(tien); //Find sibling textbox and set value
 });


 $(document).on('keyup', '.nhay', function(e) {
   if (e.keyCode == 13) {
     $(this).removeClass('nhay');
     $('#myform').append('<div><input name="salary_one[]" class="a nhay" value="" stt=""/><input name="salary_two[]" class="" value=""></div>');
     e.preventDefault(); //To cancel the default action to submit the form
   }
 })
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="myform" name="data" method="post">
  <div>
    <input name="salary_one[]" class="a nhay" value="" stt="" />
    <input name="salary_two[]" class="" value="" />
  </div>
</form>
&#13;
&#13;
&#13;