javascript - 使用 jQuery 在链接上调用内联 JavaScript

Question

我正在修改一个古老的表，它具有 <a href="javascript:<lots of shit>"> 形式的内联 JavaScript 。内联 JavaScript 可以工作，但需要几个月的时间来重写它，以便它适合我的任务，即当单击外部元素时，应该执行内联 JavaScript。

如果我没有任何意义，我很抱歉，但我已经很周到地提供了 fiddle 。 (表格方面应该不重要。)TL;DR:当我单击彩色 div 之一时我想要它的内部alert()执行，我该如何执行？

编辑。此外，该链接实际上是隐藏的!

编辑#2。而且，就目前而言，任何 HTML 都不应被篡改。仅 jQuery/JavaScript。

编辑#3。我已更新脚本以使用我的表。内在<span>现在不需要，我可以选择 <a>直接地。现在我只想知道我是否正在使用stopPropagation()正确吗？

代码:

$(function () {
    $('table.result-v2 tr.view').bind('click', function () {
        var $this = $(this),
            $next = $this.next();

        if ($next.attr('class') == 'detail') {
            var $buttons = $this.find('td.buttons'),
                $link = null;

            if ($next.css('display') == 'none') {
                $link = $buttons.find('a.show-link');
            } else {
                $link = $buttons.find('a.hide-link');
            }

            if ($link != null) {
                eval($link.attr('href')); // evaluate found link
                $link.bind('click', function (event) {
                    event.stopPropagation(); // is this needed when the link never can be clicked (it's hidden)?
                });
            }
        }
    });
});

Answer 1

这是一个可以让您的代码正常工作的快速技巧。 请注意，这完全不应该这样做!

http://jsfiddle.net/2QaUX/1/

不触发点击，而是评估 href 属性内的内联脚本:

旧:

$(function () {
    $('.foo').bind('click', function () {
        $(this).find('.bar').parent().trigger('click');
    });
});​

新:

$(function () {
    $('.foo').bind('click', function () {
        eval($(this).find('.bar').parent().attr('href'));
    });
    $('.bar').parent().bind('click', function (event) {
        event.stopPropagation(); 
    });
});​