javascript - 在 jQuery 中设置元素的 HTML 属性

Question

请检查代码..

$(".editable").live("click",function(){
CurrentOBJhtml = $(this).text();
nextHtml = "<input type='text' class='hoverable' value='"+CurrentOBJhtml+"'  />";
var c = nextHtml;
alert(c); //here two alert box comes....
$(this).html(c);

});

当我提醒 c 时，它会在两个提醒框中提醒两个值...

第一个值为<input type='text' value='myname' class='hoverable' />第二个是 <input type='text' value='' class='hoverable' />其中第二个没有 value .

当我评论最后一行( $(this).html(c); )时，它只给出第一个结果。

我有什么问题吗？我完全困惑了。

请帮我解决这个问题。

谢谢。

更新:

HTML:

  <fieldset id="user_info_module">
<label>username:</label>
<label class="editable" id="user_info_username">
<label>Email:</label>
<label id="user_info_email"> </label>
<label>Default page:</label>
<label id="user_info_defaultpage"></label>
<label>mobile:</label><label id="user_info_mobile"></label>
<label>country:</label><label id="user_info_country"></label>
<label>address:</label><label id="user_info_address"></label>
<label>pincode:</label><label id="user_info_pincode"></label>
<label>landline:</label><label id="user_info_landline"></label>
</fieldset>

http://jsfiddle.net/M3J2p/1/

Answer 1

首先将您的 jquery 代码放入 $(document).ready(function()); 中处理程序。

并检查这个jsfiddle ，它没有向我显示任何双重警报框。当您单击某个元素时，this 将引用该特定元素而不是其他元素。

更新您的相关 html 代码以确认确切的问题或为您的问题创建一个示例 jsfiddle。

编辑:错误原因及解决

Before jQuery 1.7, to stop further handlers from executing after one bound using .live(), the handler must return false. Calling .stopPropagation() will not accomplish this.

$("a").live("click", function(event){
  event.preventDefault();
});

检查您更新的jsfiddle根据你的代码。你错过了关闭一个标签，当你使用这个标签时，就会出现上述事件冒泡问题。在更新的 jquery 中使用 .on() ..

检查.live() jQuery 文档可以更好地了解这一点。