发送数据而无需提交按钮(Javascript/jQuery) [英] Send data without submit button (Javascript / jQuery)
问题描述
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form name="form1" id="form1" action="coillist" method="POST">
<table id="dataTable" border="1">
<tbody>
<tr>
<th>Coil #</th><th>Width</th><th>Gauge</th>
</tr>
<tr>
<td><input type="text" maxlength="7" size="7" name="coil_id" value="coil_11"></td>
<td><input type="text" size="7" name="width" value="120"></td>
<td><input type="text" size="5" name="gauge" value="130"></td>
</tr>
<tr>
<td><input type="text" maxlength="7" size="7" name="coil_id" value="coil_22"></td>
<td><input type="text" size="7" name="width" value="220"></td>
<td><input type="text" size="5" name="gauge" value="330"></td>
</tr>
<tr>
<td><input type="text" maxlength="7" size="7" name="coil_id" value="coil_33"></td>
<td><input type="text" size="7" name="width" value="320"></td>
<td><input type="text" size="5" name="gauge" value="330"></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>
我有一个动态行添加表，可以将行添加到表中. 我将其显示为3行，可能是1行，也可能是4行，或者如果用户想在其中添加数据，则可能是n行.
I have a dynamic row adding table that could add row into the table. I am showing it in 3 rows, it could be 1 row, or 4 rows, or n rows if a use wants to add data in.
我的问题是:如何在不单击提交按钮的情况下发送数据(coil_id)?
My question is: How can I send data (coil_id) out without click submit button?
在此示例中，我想在不使用提交按钮的情况下将coil_id(在这种情况下为coil_id = coil_22)发送到服务器.
In this example, I want to send a coil_id (coil_id = "coil_22" in this case) to the server without using submit button.
这也类似于:检测用户是否输入长度为7个字符或数字的线圈(例如:coil_22或2C12345)，然后它将提交coil_22(不是coilL_11或
This is also something like: detect if user enter a coil in length of 7 char or digit (Ex: coil_22 or 2C12345), then it will submit the "coil_22" (not coilL_11 or coil_33) to server without click any submit / send button.
我使用JavaScript/jQuery已有一段时间，有时仍然感到迷茫.
I have used JavaScript / jQuery a while, still feel lost sometimes.
非常感谢您的帮助.
推荐答案
您可以使用.keyup()进行创建，只需在每个输入中添加一个类，例如
You can make it with a .keyup(), just add a class to each input for example
<input type="text" class="coil_input" maxlength="7" size="7" name="coil_id" value="coil_11">
<input type="text" class="coil_input" maxlength="7" size="7" name="coil_id" value="coil_22">
<script>
$('.coil_input').keydown(function() {
if($.trim($(this).val()).length == 7){
var now_input_value = $(this).val();
$.post('file.php', {now_input: now_input_value}, function(){ alert('Data sent'); }).fail(function(){ alert('An error has ocurred'); });
}
});
</script>
所有输入必须具有相同的类
All the inputs has to have the same class
请记住将jQuery添加到您的文档中.
Remember to add jQuery to your document.
这篇关于发送数据而无需提交按钮(Javascript/jQuery)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
