朋友。我被一些javascript函数卡住了,无法将keyup函数读取到id为数组(qty[](的文本字段中。请帮我
<table id="dynamic">
<tr>
<td>
<label for="textfield">product :</label>
</td><td> <select name="product" id="product[0]">
<?php
$result=mysql_query("SELECT * FROM `product`");
while($row=mysql_fetch_array($result)){
?>
<option value=" <?php echo $row['id']; ?>"><?php echo $row['name']; ?></option>
<?php }?>
</select>
<label for="qty">Qty :</label>
<input type="text" name="qty" id="qty[0]"/>
<label for="textfield">Price :</label>
<input type="text" name="price" id="price[0]" readonly/>
<button type="button" name="add" id="add" class="btn btn-success">Add More</button>
</td> <div id="loader"></div></tr>
</table>
javascript
附加动态字段
<script>
$(document).ready(function(){
var i=1;
$('#add').click(function(){
$('#dynamic').append('<tr id="row'+i+'"><td><label for="textfield">product :</label></td><td><select name="product" id="product['+i+']"><?php $result=mysql_query("SELECT * FROM `product`");while($row=mysql_fetch_array($result)){?><option value=" <?php echo $row['id']; ?>"><?php echo $row['name']; ?></option><?php }?></select><label for="qty">Qty :</label><input type="text" name="qty" id="qty['+i+']"/><label for="textfield">Price :</label><input type="text" name="price" id="price['+i+']" readonly/></td><td><button type="button" name="remove" class="btn btn-danger btn_remove" id="'+i+'">X</button></td></td><div id="loader"></div></tr>');
i++;
});
$(document).on('click', '.btn_remove', function(){
var button_id = $(this).attr("id");
$('#row'+button_id+'').remove();
});
});
</script>
在这里,我试图访问qty[0]变量,但它不起作用。当它的数组工作不正常时。
<script type="text/javascript">
$(document).ready(function()
{
var i=1;
$("#qty[0]").keyup(function()
{
var qty=$("#qty[0]").val();
var pdt=$("#product[0]").val();
i++;
$.ajax({
type:"POST",
url:"price_ajax.php",
data : { qty : qty, pdt : pdt },
beforeSend: function () {
$('#loader').html('<img src="loader.gif" alt="" width="24" height="24">');
},
success:function(data)
{
$("#price[0]").val(data);
$("#loader").html("");
}
});
});
});
更改
$('#add').click(function() {
$('#dynamic').append('... id="product['+i+']">...');
i++;
});
至
$('#add').click(function() {
$('#dynamic').append('... id="product_'+i+'">...');
i++;
});
id="product[0]"
将变为id="product_0"
将相同的方法应用于其他动态元素,并在jQuery选择器中进行相关修改。一切都会好起来的。
此外,我想在这里补充一点,请中断您的append
呼叫。Javascript、HTML和PHP,一切都发生在一行中。这很令人困惑。准备一个javascript中的HTML变量。完成后,将其附加。
如下所述更新您的代码:
HTML更改:
在id="qty[0]"
字段的输入框中添加类别class='qty'
$('#add').click(function(){
$('#dynamic').append('<tr id="row'+i+'"><td><label for="textfield">product :</label></td><td><select name="product" id="product['+i+']"><?php $result=mysql_query("SELECT * FROM `product`");while($row=mysql_fetch_array($result)){?><option value=" <?php echo $row['id']; ?>"><?php echo $row['name']; ?></option><?php }?></select><label for="qty">Qty :</label><input type="text" name="qty" class="qty" id="qty['+i+']"/><label for="textfield">Price :</label><input type="text" name="price" id="price['+i+']" readonly/></td><td><button type="button" name="remove" class="btn btn-danger btn_remove" id="'+i+'">X</button></td></td><div id="loader"></div></tr>');
i++;
$( ".qty" ).each(function( index ) {
$(this).keyup(function() {
// your code here
});
});
});
Jquery更改:
$( ".qty" ).each(function( index ) {
$(this).keyup(function() {
// your code here
});
});