当我使用ajax时,我注意到Jquery效果不起作用。原因是“当您的jquery第一次运行时,您添加到DOM(页面)的新HTML不存在” another similar question
因此,我将代码更改为以下但仍然没有得到jquery效果。
我在哪里做错了?
以前的代码
$("#sendemp").click(function(e) {
e.preventDefault();
var submit_val = $("#searchbox").val();
//alert('submitval is ' + submit_val);
$.ajax( {
type : "POST",
//dataType :"jason",
url : "./wp-admin/admin-ajax.php",
data : {
action : 'employee_pimary_details',
user_name : submit_val
},
success : function(data) {
// alert('hhh');
$('#accordion21').html(data);
// $( "#searchbox" ).autocomplete({
// source: data
// });
}
});
});
新代码
$("button").on( "click", "#accordion3",function(){
$.ajax( {
type : "POST",
dataType : "json",
url : "./wp-admin/admin-ajax.php",
data : {
action : 'employee_deatils_search',
user_name : submit_val
},
success : function(data) {
// alert('hhh');
$('#accordion3').html(data);
$("tr:odd").css("background-color", "#F8F8F8");
$("#accordion3").accordion({ heightStyle: "fill", active: 0 });
// $( "#searchbox" ).autocomplete({
// source: data
// });
}
});
} );
我有以下提交按钮
<input type="submit" id="sendemp" value="Search" />
答案 0 :(得分:0)
我不认为您的点击绑定是正确的,如果您想要处理#accordion3
内部按钮的点击,请将其更改为:
$("#accordion3").on( "click", "button",function(){...});
答案 1 :(得分:0)
没有你的html很难说,但是你的旧代码看起来就像是替换了sendemp按钮。在新代码中,您的事件委派未正确指定。您正在将委托应用于按钮元素(由于您的sendemp按钮是输入元素,因此不存在)。
将委托应用于#sendemp的父级,如下所示:
$('body').on('click', '#sendemp', function() {
// your ajax call
});
答案 2 :(得分:0)
我可以解决这个问题,我尝试了使用on
方法的上述解决方案。但是,这对我的问题没有意义。
正如下面的艺术解释我认为,手风琴已经被实例化并且效果持续存在。当它第二次被调用时,它不会再次创建,因为已经存在效果。
因此,我需要摧毁它并重新创造手风琴。 support link
我在成功时更改了代码,如下所示
success : function(data) {
// alert('hhh');
$('#accordion3').accordion('destroy');
$('#accordion3').html(data);
$("tr:odd").css("background-color", "#F8F8F8");
//$("#accordion3").accordion( "disable" );
$("#accordion3").accordion({ active: 0 });
}
来自$(document).ready(function() {
我添加了
$(function() {
$("#accordion3").accordion({
// heightStyle: "fill",
active: 0 });
});