我有两个不同的输入字段,它们有各自的提交按钮,我希望用户能够将他们的输入输入到任一文本框中,然后按下回车键,效果与单击相同在提交按钮上。目前,在文本框中输入内容并按下回车键没有任何作用。我正在使用 HTML 和 JavaScript 以及 ASP .NET MVC3。我的代码如下所示:
HTML
<table>
<tr>
<td><span class="labelText">Text1</span></td> <td><input id="text1" type="text" placeholder="Enter Text1"/> </td> <td style="width: 110px; text-align: left; margin-left: 5px"><button class="medium awesome blue" id="sendText1">Send Text1</button></td>
</tr>
<tr>
<td> <span class="labelText">Text2</span> </td> <td><input id="text2" type="text" placeholder="Enter Text2"/> </td> <td style="width: 110px; text-align: left; margin-left: 5px"> <button class="medium awesome blue" id="sendText2">Send Text2</button> </td>
</tr>
JavaScript
$('#sendText1').click(function () {
$('#text2').val("");
var text1 = $("#text1").val();
$('#loadingUsageInfo').css({ 'visibility': 'visible' });
if (text1 == "" || text1 == 'Enter Text1') {
alert('Enter Text First');
return;
}
$.ajax({
url: '@Url.Action("ShowResult1", "Folder")',
type: 'POST',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify({ input1: text1 }),
traditional: true,
success: function (result) {
$('#info').html(result);
}
});
});
$('#sendText2').click(function () {
$('#text2').val("");
var text2 = $("#text2").val();
$('#loadingUsageInfo').css({ 'visibility': 'visible' });
if (text2 == "" || text2 == 'Enter Text2') {
alert('Enter Text First');
return;
}
$.ajax({
url: '@Url.Action("ShowResult2", "Folder")',
type: 'POST',
contentType: 'application/json; charset=utf-8',
data: JSON.stringify({ input2: text2 }),
traditional: true,
success: function (result) {
$('#info').html(result);
}
});
});
提前致谢!
最佳答案
在你的js代码下面添加这个
$('#text1, #text2').keypress(function(e) {
if (e.which == 13) {
$('#sendText1, #sendText2').trigger('click');
}
});
Trigger - 执行附加到给定事件类型的匹配元素的所有处理程序和行为。
所以我们在按键上绑定(bind)文本输入并调用按钮的所有绑定(bind)。
另请参阅它在 jsFiddle 上的工作原理
关于javascript - 有两个按钮时如何使用回车键提交,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11596334/