点击输入键/返回键应该会触发提交按钮

Question

我想使用提交按钮单击事件添加项目。现在我正在尝试实现它，以便当您输入数字并按回车时，它应该触发提交按钮并将该项添加到表中。我使用了keypress事件，它不起作用。这里是my sample code。

我觉得我做错了什么。我的代码如下。

// json data object 
 
var data = JSON.parse('{ "122233334444": ["Book","Three Musketters","DE7598490587","7584092043857", "03/18/13 11:17:51 AM","03/18/13 11:17:51 AM", "1" ], "122223355552":["eBook","Fall Colors","XYZ29494949","7584092043857", "03/18/13 11:17:51 AM","03/18/13 11:17:51 AM", "2" ], "122223355533":["eBook","Snowfall","XYZ29494949","7584092043857", "03/18/13 11:17:51 AM","03/18/13 11:17:51 AM", "3" ] }'); 
 
$("#submitid").keypress(function() { 
 
    $('#resend').prop('disabled', false); 
 
    $('#receipt').prop('disabled', false); 
 
    var rowId = $("#number").val(); 
 
    $("#number").val(""); 
 
    var rowData = data[rowId]; 
 
    if (rowData) { 
 
    var tr = $("<tr><td><input id='item-id' type='checkbox' checked/></td></tr>").attr("id", "datatable-row-" + rowId); 
 
    for (var col = 0; col < rowData.length; col++) 
 
     tr.append($("<td></td>").text(rowData[col])); 
 
    $("#datatable").prepend(tr); 
 
    $("#datatable").show(); 
 
    } else { 
 
    alert("Row doesn't exist in json object: " + rowId); 
 
    } 
 
}); 
 
$('#receipt').click(function() { 
 
    $('.column-id').removeAttr('checked'); 
 
    $('#resend').prop('disabled', true); 
 
    $('#receipt').prop('disabled', true); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input id="number" type="text" /> 
 
<button id="submitid">Submit</button> 
 

 
<table id="datatable"> 
 
    <colgroup> 
 
    <col><col><col><col><col><col><col><col> 
 
    </colgroup> 
 
    <thead> 
 
    <tr> 
 
     <th rowspan="1" colspan="1"> 
 
     <input type="checkbox" class="select-all column-id" id="item-id" title="Select All"> 
 
     </th> 
 
     <th rowspan="1" colspan="1"> 
 
     <div> 
 
      <span><a href="#" title="">Format</a></span> 
 
     </div> 
 
     </th> 
 
     <th rowspan="1" colspan="1"> 
 
     <div> 
 
      <span><a href="#" title="">Title</a></span> 
 
     </div> 
 
     </th> 
 
     <th rowspan="1" colspan="1"> 
 
     <div> 
 
      <span><a href="#" title="">Number</a></span> 
 
     </div> 
 
     </th> 
 
     <th rowspan="1" colspan="1"> 
 
     <div> 
 
      <span><a href="#" title="">Code</a></span> 
 
     </div> 
 
     </th> 
 
     <th rowspan="1" colspan="1"> 
 
     <div> 
 
      <span><a href="#" title="">Checkout Date</a></span> 
 
     </div> 
 
     </th> 
 
     <th rowspan="1" colspan="1"> 
 
     <div> 
 
      <span><a href="#" title="">Due Date</a></span> 
 
     </div> 
 
     </th> 
 
     <th rowspan="1" colspan="1"> 
 
     <div> 
 
      <span><a href="#" title="">ItemId</a></span> 
 
     </div> 
 
     </th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td><input id="item-id" class="column-id" type="checkbox"></td> 
 
     <td>Book</td> 
 
     <td>Three Musketters</td> 
 
     <td>DE7598490587</td> 
 
     <td>7584092043857</td> 
 
     <td>03/18/13 11:17:51 AM</td> 
 
     <td>03/18/13 11:17:51 AM</td> 
 
     <td>1</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
<button id="resend" disabled>Resend</button> 
 
<button id="receipt" disabled>Receipt</button>

有什么建议？

krish

Answer 1

您需要处理输入​​或keypress没有提交按钮：

$('#number').keydown(function (event) { 
    if (event.keyCode === 13) { 
     // Enter was pressed 
    } 
}); 

Answer 2

以下是事情，你应该知道
1）你需要知道键码输入密码（即）

2）由于您已标记jQuery，学习event.which，这个属性表示被按下的特定键或按钮。

3）.trigger()，执行附加到给定事件类型的匹配元素的所有处理程序和行为。

$("#number").on('keypress', function (e) { 
    if(e.which == 13) { // check keycode condition  
    $('#submitid').trigger('click'); 
    } 
    else { 
    //Todos 
    } 
    e.preventDefault(); //Toprevent bounce 
});