主页div使用Ajax请求进行更新。更新后的html包含一个带有输入字段的表单，一个按钮以及另一个提交该表单的Ajax脚本。虽然可以通过按注入的表单中的按钮来启动第二个脚本，但是该脚本似乎无法通过id查找表单输入。我读到有关JQuery的.on（）方法的信息，但它似乎仅提供对动态更新函数的访问，而不是对元素的访问。在使用Ajax请求将该元素注入代码后，如何通过ID获得输入元素？
主页：
<div id="output"></div>
<span id="call_account">Account</span>
$("#call_account").click(function(){
$.get('/accounts/login/', {}, function(data){
$('#output').html(data);
});
});
注入#output html：
<input id="id_username" name="username" type="text">
<input id="id_password" name="password" type="password">
<span id="account_submit">Submit</span>
$("#account_submit").on("click", function() {
var id_username = $('#id_username').val();
var id_password = $('#id_password').val();
$.ajax({
type:"POST",
url:"/accounts/login/",
data: {
'username': id_username,
'password': id_password,
},
success: function(data){
$('#output').html(data);
}
});
});
});
当我尝试提交表单时，id_username和id_password是未定义的。
编辑：由于下面的人的回答，我能够使它工作。我还在此过程中对该问题进行了jsfiddle模拟：https ://jsfiddle.net/hn1Lrkzs/希望它将来对某人有帮助，我在寻找直接答案时遇到了麻烦，并且缺乏从帮助文件中得到帮助的知识。
将您的js封装在里面 document.body
<script>
$(document.body).on("click", "#account_submit", function() {
var id_username = $('#id_username').val();
var id_password = $('#id_password').val();
$.ajax({
type:"POST",
url:"/accounts/login/",
data: {
'username': id_username,
'password': id_password,
},
success: function(data){
$('#output').html(data);
}
});
});
</script>
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句