通过在.find（）之后链接插件意外的jQuery语法错误

Question

我已经烘焙了一个plug-in来处理我在大型站点上使用的输入字段上的运行时搜索。

该插件在任何情况下都可以完美运行，但是此http://jsfiddle.net/tonino/v8d2A/

$(document).ready(function () {
    var callback_methods = { /* methods here */ };
    var input_html = '<div class="search"><input name="search-field" value="Search..."></div>';
    $(document).on('click', 'div.add', function (event) {
        if (!$('li div.add + div').hasClass('search')) {
            var input = $(this).after(input_html).parent().find('input');
            input.focus();
            input.hunter({url:'<?php echo $this->request->base; ?>/searches', callback:callback_methods, var_name:'data[Search][term]'});
            // other code after
        }
    });
});​

如果我对猎人插件发表评论，一切都会很好。

我敢肯定有一些关于如何组织结构的概念，这是代码： jquery.hunter.1.3.js

为什么我的plug-in在这种情况下会出错（我写错了）？

Answer 1

问题是您的代码的这一部分：

var selector = this.selector;

var def_css = {backgroundPosition:'-16px center', paddingLeft:$(selector).css('padding-left')}
if (settings.loader) { setStyle(def_css); }
   var selector = this.selector;

然后：

$(this.selector).blur(function () {

首先，当满足if条件时，代码将无法工作，因为您正在尝试在if块内重新声明变量'selector'。 只需将var语句留在那里：

if (settings.loader) { setStyle(def_css); }
  selector = this.selector;

但是您的主要问题是“ this.selector”包含“ .parent（）input”，我怀疑这是一个有效的jQuery选择器。

你为什么要这么做？ 为什么不使用$（this）将其保存到变量中并使用它呢？

例如：

// first line in your plugin
$this = $(this) 


// later you could use the $this var
$this.blur(function () {

Answer 2

要消除错误，请更改此行：

var input = $(this).after(input_html).parent().find('input');

要以下内容：

var input = $(input_html).insertAfter($(this));

但是，核心问题是jquery.hunter插件出于某种原因使用了this.selector变量-您不需要它-插件应使用$(this)而不是$(this.selector)