javascript - 追加到DIV后找不到元素ID

Question

我正在使用 jQuery 的这段代码在选中复选框后将文本输入字段附加到 div:

$('.sharewithfriends').on("click", ".manual-invite", function () {
        if ($('input[name=manual-invite]').is(':checked')) {
          $('<li style="margin-top:0;display:none"><input type="text" id="invite_email1" name="invite-email1" value="Add an E-Mail" onfocus="clearText(invite_email1);" onblur="fillText(invite_email1);"/><span><a class="add" href="">Add</a></span></li>').appendTo('#invite-emails').slideToggle();

}

除了 onfocus 和 onblur 事件之外，所有这些都工作正常。他们调用以下简单函数，这些函数应该清除焦点字段并用模糊时的默认文本填充它:

function clearText(thefield){
if (thefield.defaultValue==thefield.value)
thefield.value = ""
}

function fillText(thefield){
if (thefield.value=="")
thefield.value=thefield.defaultValue;
}

但是当我单击该字段时，我收到一条错误消息，提示“invite_email1 未定义”，尽管它显然是这样。

有人知道我需要做什么才能让它发挥作用吗？

Answer 1

您没有引用正确的元素。

将 clearText(invite_email1); 替换为 clearText(this);。
更好的是，绑定(bind)事件监听器而不是添加内联事件。