我有一个ajax函数，我必须点击两次才能工作。我想只需点击一下即可。它在我添加一个click事件之前工作，该事件检查我点击的文本并将其用作URL的一部分。我的问题可能存在于那里。我需要对可能出错的问题有一个全新的认识。
jQuery的：
function ajaxShow(){
$('#formats a').click(function(e) {
var txt = $(e.target).text();
console.log(txt);
$.ajax({
url : "./enablereports/" + txt + ".html",
data: "html",
contentType:"application/x-javascript; charset:ISO-8859-1",
beforeSend: function(jqXHR) {
jqXHR.overrideMimeType('text/html;charset=iso-8859-1');
},
success : function (data) {
$("#rightDiv").html(data);
}
});
});
}
HTML：
<body>
<div id="wrapper">
<div id="enablestuff" class="yellowblock">
<h3 id="title" class="header">Enable Formats</h3>
</div>
<div id="formats" class="lightorangeblock">
<a href="" onclick="ajaxShow();event.preventDefault()">ADDSTAMP</a><br>
<a href="" onclick="ajaxShow();event.preventDefault()">SCLGLDNB</a><br>
<a href="" onclick="ajaxShow();event.preventDefault()">SCLGLVNB</a><br>
</div>
</div>
<div id="rightWrap">
<div id="rightDiv">
</div>
</div>
</body>
问题是每个锚元素都有一个指向ajaxShow的内联事件处理程序，然后ajaxShow为将来的点击设置实际的事件处理程序。
相反，消除内联处理程序，只需设置没有<a>包装器的实际处理程序。
我还建议您不要使用<div>元素，因为您实际上并未在任何地方导航，因此元素的使用在语义上是不正确的，并且会对依赖辅助技术来使用Web的人造成问题。相反，既然你想要在每个“链接”之间换行，请使用name元素，并将它们设置为看起来像链接。
最后，您在最后一个div元素上使用了name属性，但id仅在表单字段中有效。如果需要，你可以给它一个$('#formats div').click(function(e) {
var txt = $(e.target).text();
console.log(txt);
$.ajax({
url : "./enablereports/" + txt + ".html",
data: "html",
contentType:"application/x-javascript; charset:ISO-8859-1",
beforeSend: function(jqXHR) {
jqXHR.overrideMimeType('text/html;charset=iso-8859-1');
},
success : function (data) {
$("#rightDiv").html(data);
}
});
});。
#formats div { text-decoration:underline; color:blue; cursor:pointer; }<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="wrapper">
<div id="enablestuff" class="yellowblock">
<h3 id="title" class="header">Enable Formats</h3>
</div>
<div id="formats" class="lightorangeblock">
<div>ADDSTAMP</div>
<div>SCLGLDNB</div>
<div>SCLGLVNB</div>
</div>
</div>
<div id="rightWrap">
<div id="rightDiv"></div>
</div>onclick这是因为你绑定了onclick函数中的jQuery处理程序 - 只需删除整个$('#formats a').click(function(e) {
e.preventDefault();
var txt = $(e.target).text();
console.log(txt);
$.ajax({
url : "./enablereports/" + txt + ".html",
data: "html",
contentType:"application/x-javascript; charset:ISO-8859-1",
beforeSend: function(jqXHR) {
jqXHR.overrideMimeType('text/html;charset=iso-8859-1');
},
success : function (data) {
$("#rightDiv").html(data);
}
});
});
属性并将你的处理程序绑定到函数之外。
<div id="formats" class="lightorangeblock">
<a href="">ADDSTAMP</a><br>
<a href="">SCLGLDNB</a><br>
<a href="">SCLGLVNB</a><br>
</div>
和HTML
qazxswpoi
我通过添加ajaxShow（）得到了这个工作;到$（document）.ready（function（）。
很脏，但它有效。