【问题标题】:Bind live each function with a click event?用点击事件绑定每个功能?
【发布时间】:2013-04-14 18:52:26
【问题描述】:

我已经搜索并找到了多个答案,只是声明将我的函数包装在点击处理程序中,尽管我希望它在页面加载时运行,或者在我的 javascript 完成插入所有 html 后运行。

我有一个动态创建的整个页面。我正在使用这个 sn-p 来修复 IE 的占位符。它确实有效,但不适用于实时创建的元素。

$(document).ready(function(){    
    // Placeholder Fix for IE < 9    
    $("[placeholder]").each(function() {        
        var val = $(this).attr("placeholder");
        if ( this.value === "" ) {
            this.value = val;
        }
        $(this).focus(function() {
            if ( this.value == val ) {
                this.value = "";
            }
        }).blur(function() {
            if ( $.trim(this.value) === "" ) {
                this.value = val;
            }
        });
    });
    // Clear default placeholder values on form submit
    $('form').submit(function() {
        $(this).find("[placeholder]").each(function() {
            if ( this.value == $(this).attr("placeholder") ) {
                this.value = "";
            }
        });
    });
});

我正在用js添加表单元素,例如:

$('body').append('<input type="text" placeholder="placeholdertext" />');

有人可以建议如何解决这个问题吗?

香农

【问题讨论】:

  • 当你说动态创建..你是指服务器还是js?如果在 for 循环运行时目标元素还没有在 dom 中,那么它显然不会起作用。如果您在 JS 中动态添加文本输入,请使用 $(&lt;target that already exists in dom&gt;).on('focus','&lt;target inputs&gt;', function(e) { /* stuff here */ });
  • 无论何时添加具有placeholder 属性的新元素,都需要为这些新元素运行代码。提供添加新元素的示例代码
  • 对模糊执行相同的操作,并在创建控件时设置控件值。 on 等同于 live
  • 还请注意,您不只是为 IE 运行此代码......您正在为所有浏览器运行它。使用功能检测仅在不支持placeholder 的浏览器上运行它。已经为此开发了许多插件
  • 这个脚本在它的 js 文件中,包裹在一个 html if 语句中,它只包含在 IE 中,是的,我正在包含带有 javascript 的表单元素,我不想绑定这个函数像模糊或焦点这样的事件,因为我希望脚本在用户使用任何表单字段之前运行。正如我所提到的,它替换了占位符属性,所以我显然不希望它在用户单击该字段时构建它。谢谢!

标签: jquery bind live placeholder


【解决方案1】:

这就是你要找的吗?

on() 函数将处理程序应用于页面上适合选择器的所有元素,而不仅仅是特定元素(如 .focus 和 .blur) 更多信息在这里:http://api.jquery.com/on/

$(this).on("focus", function() {
            if ( this.value == val ) {
                this.value = "";
            }
        }).on("blur", (function() {
            if ( $.trim(this.value) === "" ) {
                this.value = val;
            }
        });
});

【讨论】:

  • 不,我一直在寻找一种解决方案,可以在没有事件的情况下运行上述函数,以便在页面加载时调用它。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2022-01-08
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多