Question

我有以下代码：

<input class="button button-blue" type="button" onclick="jQuery.fancybox.close(); " value="Close">

即当我点击按钮时，onclick事件处理程序不起作用。＆＃34;没有工作＆＃34;这意味着花式框对话框不会关闭。但是只要我使用f12对onclick值进行更改（即在jQuery.fancybox.close（）之后添加一个空格），onclick事件处理程序就会开始工作。

注意：

没有脚本错误
适用于chrome和firefox
似乎对onclick值的任何更改都将导致事件处理程序开始工作。

有关如何排除故障的任何建议吗？

$.fancybox({
      'modal': true,
       height: '10%', minHeight: '60',
       'content': "<div style=\"margin:10px;\">"
       + 'Your message has been sent.'
       + "<div style=\"text-align:center;margin-top:10px;\"><input     class=\"button button-blue\" type=\"button\" onclick=\"jQuery.fancybox.close();  Backbone.pubSub.trigger('myContentShowHide');\" value=\"My Content\"></div>"
       + "<div style=\"text-align:center;margin-top:10px;\"><input     class=\"button button-blue\" type=\"button\" onclick=\"jQuery.fancybox.close();   \" value=\"Close\"></div>"
});

Answer 1

您已经安装了jQuery，它专门用于规范化任何跨浏览器问题。

因此，摆脱内联事件处理程序并使用jQuery事件处理程序。由于调用此代码时按钮元素尚不存在，因此您需要使用事件委派方法......

jQuery(document).ready(function($) {

    $('body').on('click', 'input.button[value="Close"]', function() {
        $.fancybox.close();
    });

});

请参阅：http://api.jquery.com/on/

DEMO：http://jsfiddle.net/6k1o7amL/

Answer 2

避免使用内联事件处理程序。使用jQuery将事件绑定到按钮，如下所示：

jQuery(document).ready(function(){

   jQuery('.button').click(function(e){
      jQuery.fancybox.close();
      e.preventDefault();
   });

});

onclick不在

2 个答案: