Question

我的页面正文中有以下jQuery。基本上，当用户点击订阅按钮时，该按钮被具有文本输入和提交按钮的表单替换。因此页面加载时不存在表单。

默认情况下，文字输入中包含“输入您的电子邮件”。我想在用户点击它时清空文本字段。我知道如果在页面加载完成后表单已经存在，如何执行此操作，但这不是这种情况。我知道我需要使用一个委托事件，所以我查了一下，然后想出了你在脚本的第二部分看到的内容，但它没有用。

<script>
    $('#subscribeline #subscribe').click(function(){
        $('#subscribeline').html("<form id='subscribeform'><input type='email' name='email' id='email' value='Enter your email'><input type='submit' name='submit' id='submit' value='OK'></form>");
    });

    $( '#subscribeform #email' ).on( "click", "td", function() {
      $('#subscribeform #email').text('');
    });
</script>

Answer 1

您正在编写错误的事件，使用ul#subscribline编写委托事件，并在id为电子邮件的输入上编写。

这样做：

 $( "#subscribeline" ).on( "click", "#email", function() {
      $(this).text("");
    });

而不是编写文本，您可以使用html5的placeholder属性。

请参阅Example HERE

你可以像这样添加占位符：

$('#subscribeline #subscribe').click(function(){
        $('#subscribeline').html("<form id='subscribeform'><input type='email' name='email' id='email' placeholder='Enter your email'><input type='submit' name='submit' id='submit' value='OK'></form>");
    });

然后您不需要编写点击事件并删除输入字段内的默认文本。

单击在页面加载时不存在的元素上的事件

1 个答案: