标签: unobtrusive-javascript

如果我[Required(AllowEmptyStrings = true)]在视图模型中有声明,则始终在空输入上触发验证.我发现这篇文章解释了它为什么会发生.你知道是否有修复方法吗？如果没有,你如何处理它？

始终建议通过将所有代码放在一个JS文件中来避免内联Javascript代码,该文件包含在所有页面中.我想知道,如果这不会导致重页面的性能问题.

例如,假设我们有数十个这样的函数

function function1(element){
var el=document.getElementsByClassName(element);
var size=el.length;
if(size==0) return;
for(i=0;i<size;i++){
// the process
}
}

在每个页面上,我们需要运行函数来知道HTML中是否有相应的元素.

window.onload = function(){
function1('a');
....
function26('z');
};

但如果将所有函数保存在外部JS文件中,并通过内联调用函数JavaScript,我们只能调用当前页面中所需的函数:

<script type="text/javascript">
window.onload = function(){
function6('f');
};
</script>

从性能的角度来看,通过内联调用函数Javascript(当然不是最佳实践)来避免调用页面中不需要的大量函数不是有益的吗？

当然,这不仅仅限于功能,因为我们有很多addEventListener针对整个网站的s,它们在每个页面上被触发,不需要它们.

我一直在研究一个应用程序,前端主要是使用jQuery.

我们依赖于页面上存在的某些分类元素,以便我们可以将行为附加到它们.例如:

$('.block').on('click', clickHandler);

其他开发人员之一说我们应该将表示与逻辑分离(我同意).因为这些类用于表示,所以他建议使用数据属性:

$('[data-attribute-name~=value]').on('click', clickHandler);

但是,我知道以下关于这种方法:

• 它的性能明显低于基于类的选择器
• HTML类用于向DOM元素赋予语义含义,因此不限于表示用途.

在阅读不引人注目的javascript时,我没有看到任何特别提及.

使用[data-attribute]over class/ID有什么主要区别？

这完全取决于性能/偏好吗？

我有一个使用大量回调的JavaScript应用程序.典型的函数将进行回调,并使用另一个回调进行包装.

Namespace.foo = function( arg, their_on_success ) {
    var my_on_success = function( result ) {
        console.log( 'my_on_success() called' );
        if( 'function' === typeof their_on_success ) {
              their_on_success( result );
        }
    }
    something( arg, my_on_success );
};

鉴于以上示例,何时应该使用本机call()方法(将结果var作为第二个参数their_on_success()传递)而不是通过函数调用来调用和传递结果？

我正在寻找使用JQuery对Unobtrusive Javascript进行10分钟的精彩介绍.我对这个概念完全陌生,我想看看事件绑定如何起作用.

作为一些背景,我正在寻找一个类似于我们在这里所做的"删除此标签"系统.看看源代码,我没有看到任何js,只是一个img标签.这让我觉得必须有外部的js绑定到click事件.我想知道如何做到这一点,我想要一个向我展示的教程!

我正在使用rails,但是在使用jQuery时不显眼地执行我的所有Javascript application.js.

不幸的是,这使得引用URL非常困难.例如,如果我想提供字段自动完成行为,我必须硬编码自动完成URL,application.js因为rails url_for不可用.

是否有可能application.js使用erb？我是否以错误的方式思考这个问题？

在Rails 3中,将:confirm参数传递给link_to将填充链接的data-confirm属性.这将在单击链接时引发JS alert().

我正在使用rails jQuery UJS适配器(https://github.com/rails/jquery-ujs).rails.js的相关代码是:

$('body').delegate('a[data-confirm], button[data-confirm], input[data-confirm]', 'click.rails', function () {
    var el = $(this);
    if (el.triggerAndReturn('confirm')) {
        if (!confirm(el.attr('data-confirm'))) {
            return false;
        }
    }
});

和

triggerAndReturn: function (name, data) {
        var event = new $.Event(name);
        this.trigger(event, data);

        return event.result !== false;
    }

我想知道如何修改它以产生一个jQuery对话框(例如jQuery UI对话框),允许用户确认或取消.

我对JavaScript的了解不足以实现这一目标.我目前的方法是简单地重写$('body').delegate()函数来实例化灯箱.但是我想,有一种比这更有效的方法.

我想调用一个javascript函数,该函数将以用户对确认框的响应为条件.

例如,我有以下锚点:

<%= link_to 'Sign Out', destroy_session_path, confirm: 'Are you sure that you would like to sign out?', method: :delete %>

我应该放弃不引人注目的javascript并将我自己的jQuery回调绑定到我的锚点吗？

或者是否有一些神奇的方法将回调函数传递给Rails url帮助器？我没有在文档中看到任何关于回调的讨论.

jQuery Validation使验证电子邮件地址变得简单:

$("someForm").validate({
    rules: {
        SomeField: {
            required: true,
            email: true,
            remote: {
                type: "POST",
                url: "CheckEmail"
            }
        }
    }
});

这使得SomeField成为必需,必须格式化为电子邮件地址,并且还执行对CheckEmail操作的远程调用(检查重复项).

我喜欢让事情变得尽可能简单,所以我可以用Data Annotations做很多相同的事情:

public class RegisterModel {
    [Required]
    [Remote("CheckEmail", "Home", HttpMethod="POST")]
    public string SomeField { get; set; }
}

ASP.net MVC 3/Data Annotations是否有内置/简单的方法来验证以确保电子邮件地址的格式正确？

如果可能的话,我希望它能产生不引人注目的javascript.

考虑一个简单的JS事件

document.getElementsByClassName('test')[0].onclick=function(){
document.getElementsByClassName('test')[0].innerHTML = 'New Text';
}

如何将此代码扩展为通常适用于所有元素class="test".我的意思是点击元素并替换其内容.实际上,我们需要从click事件中获取节点号(在括号内提供).

我试图更好地理解不显眼的代码中的javascript,而不是像jQuery这样的实用方法.