Question

这段代码在Opera 12中运行起来非常奇怪。父元素只是 ul ，这就是Firefox和Chrome返回的内容在Opera $（this）.parent（）返回 Window 对象。

有什么想法吗？ jQuery版本是1.7.2

JS
    $('.addTrait').live('click', function(e) {
        e.preventDefault();
        trait = $('li.trait.template').clone().removeClass('template');
        parent = $(this).parent();
        $(parent).after(trait);
        trait.show();
    });


HTML
<ul class="sortable traits">
    <li class="trait">
    <div class="well slim">
        <input class="trait name" type="text" name="trait[%s][name]" value=""/>
        <input class="trait id" type="hidden" name="trait[%s][id]" value=""/>
        <input class="trait parent" type="hidden" name="trait[%s][parent]" />
        <a href="" class="addTrait icon-plus"></a>
        <a href="" class="removeTrait icon-remove"></a>
    </div>
    <ul>
    </ul>
    </li>
</ul>
<li class="trait template" style="display: none;">
    <div class="well slim">
    <input class="trait name" type="text" name="trait[%s][name]" value=""/>
    <input class="trait id" type="hidden" name="trait[%s][id]" value=""/>
    <input class="trait parent" type="hidden" name="trait[%s][parent]" />
    <a href="" class="addTrait icon-plus"></a>
    <a href="" class="removeTrait icon-remove"></a>
    </div>                
    <ul>
    </ul>
</li>

Answer 1

正如@ raina77ow在评论中指出的那样，您需要将parent定义为局部变量。 Opera禁止在全局对象上更改parent（为了安全起见，各种插件会查看各种内容以检查它们运行的来源，但不可避免地会覆盖parent会破坏它。）

Answer 2

请养成一个习惯，将变量声明为本地变量。它不仅可以修复像那样的错误，还可以用于性能优化。拿这两个片段，例如：

function foo() {
  function bar() {
    var someUrl = 'http://example.com';
    $.getJSON(someUrl, function() { ... };
  }
}

function foo() {
  function bar() {
    someUrl = 'http://example.com';
    $.getJSON(someUrl, function() { ... };
  }
}

如您所见，在两个片段中，JS在调用someUrl时必须评估$.getJSON表达式。

在第一个变量中，此变量被声明为bar函数的本地变量，因此它的查找速度非常快。

但是，在第二个中，此变量名实际上是指全局（window）对象的属性。但是JS并不知道：它仍然必须一直向上扩展到范围链 - 只是失败并且回退到访问window.someUrl。

当然，在处理一个或两个变量时，差异（通常）可以忽略不计。但通常会有数十个这样的，并且这个常量沿着范围链走（并最终诉诸于属性访问）会对脚本的性能产生巨大影响。

Opera 12和jQuery父选择器

2 个答案: