当页面加载时,我默认获取并输入如下:
<input type="text" class="form-control input-sm productName" id="" placeholder="Search..." />
我正在使用的预输入代码是这样的
$.get('../search_product.php', function(data){
$(".productName").typeahead({ source: data });
},'json');
默认情况下,这对我的输入工作正常,但在我使用 append
添加新元素后,它不再工作,我如何才能使其适用于新元素?
我想知道如何使用变量发送我在输入中键入的值,因为我现在在服务器端执行此操作只是一个示例
echo json_encode(array('hi', 'hi 2', 'hi 3', 'hi 4'));
我的意思是如何发送像这样的参数
$query = $_GET['param'];
希望您能帮助我,谢谢。
更新:
$('#containerProducts').append('<div class="row m-t-5">' +
'<div class="col-sm-offset-2 col-sm-4"><input type="text" class="form-control input-sm productName" id="" placeholder="Search..." /></div>' +
'</div>'
);
最佳答案
在 Javascript 中,当创建一个元素时,事物不会自动绑定(bind)到它。您应该将预输入初始化隔离在其自己的函数中,然后每当创建元素时,您都可以调用它来初始化新元素。例如:
function initTypeahead() {
// Should probably add code here to only grab elements that are not already initialized
var elements = $('.productName');
$.get('../search_product.php', function(data){
$(elements).typeahead({ source: data });
}, 'json');
}
然后,当您初始化页面时,您将调用它来初始化初始元素。
$(document).ready(function() {
initTypeahead();
});
如果添加新元素,您将再次调用它:
$('#containerProducts').append('<div class="row m-t-5">' +
'<div class="col-sm-offset-2 col-sm-4"><input type="text" class="form-control input-sm productName" id="" placeholder="Search..." /></div>' +
'</div>'
);
initTypeahead();
关于php - Bootstrap Typeahead 不适用于动态输入,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38530943/