现在我知道这个基本问题之前已被问过,但我一定是做错了。我知道在我可以对它做任何事情之前必须绑定一个附加元素。但是,尝试我可能无法让它工作。
当人们点击收音机选择时,我正在显示一条消息并显示。当我尝试绑定新元素时,它会以奇怪的方式堆叠。它将开始堆叠元素。例如 - [单击1]消息1,[单击2]消息1和2,依此类推。
我已经尝试了一大堆不同的方法来绑定它。我希望删除会删除#feedback,然后创建并绑定下一条消息。我必须做一些非常错误的事情。我知道这与其他帖子非常相似,但我经历了所有这些帖子并且无法找到足够明确的答案来帮助。先谢谢你。
HTML
<div class="answers">
<ul>
<li>
<input id="answer" type="radio" onclick="feedback('THE MESSAGE HTML')"><label>Label</label>
</li>
</ul>
</div>
JavaScript的:
function feedback(message)
{
$('#answer').live('click', function()
{
$('#feedback').remove();
});
$('#answer').live('click', function()
{
$('.answers').append('<div id="feedback">'+message+'</div>');
});
};
如果我正确理解你的问题,我已经做了一个 小提琴 这有效地工作。这个问题与你如何分配事件处理程序有关,并且正如其他人所说的那样,你已经过了事件处理程序。目前的jQuery最佳实践是使用 on()
注册事件处理程序。这是jQuery文档的链接 on
: 链接
您的原始解决方案非常接近,但您添加事件处理程序的方式有点令人困惑。不向HTML元素添加事件是最佳实践。我建议阅读Unobstrusive JavaScript。
这是JavaScript代码。我添加了一个计数器变量,以便您可以看到它正常工作。
$('#answer').on('click', function() {
feedback('hey there');
});
var counter = 0;
function feedback(message) {
$('#feedback').remove();
$('.answers').append('<div id="feedback">' + message + ' ' + counter + '</div>');
counter++;
}
该 live
function正在注册click事件处理程序。每次单击对象时都会这样做。因此,如果单击两次,则会为对象分配两个单击处理程序。您还在此处指定了一个点击处理程序:
onclick="feedback('the message html')";
然后单击处理程序通过分配另一个单击处理程序 live()
。
真的我认为你想做的是这样的:
function feedback(message)
{
$('#feedback').remove();
$('.answers').append('<div id="feedback">'+message+'</div>');
}
好的,根据你的评论,尝试取出 onclick
的一部分 <a>
元素,而是把它放在一个 document.ready()
处理程序。
$('#answer').live('click',function(){
$('#feedback').remove();
$('.answers').append('<div id="feedback">'+message+'</div>');
});
你在页面上有多个单选按钮吗?
因为我看到的是,当您单击单选按钮时,您将事件分配给页面上的所有单选按钮
我会做的事情如下:
$(documento).on('click', '#answer', function() {
feedback('hey there');
});