如何使用单击事件 jquery 处理模糊事件答案

【问题标题】：How to handle blur event with click event jquery如何使用单击事件 jquery 处理模糊事件
【发布时间】：2012-04-17 07:49:03
【问题描述】：

我有一个这样的 html 标记

<li id="fSearch" class="alwsShown">
            <div class="dark overflowHidden" id="fSearchBg">
                            <input type="text" id="filter" name="" style="width:140px" tabindex="1" class="fullWidth opt resetBorderNShd resetShd" value="" autocomplete="off" title="Search" value=""/>
             <span id="stopSearch" class="imgSprite stopSearch displayNone poAbs"></span>
            </div>

          </li>

使用 jquery

var test = function() {
    var self = this,
    $filter = $("#filter"),
    $fSearchBg = $("#fSearchBg"),
    $stopSearch = $(".stopSearch");
    // Blur
    $filter.blur(function() {
      $filteranimate({
        width: "140px"
      }, 200, function() {
        $fSearchBg.removeClass("light").addClass("dark");
        $stopSearch.hide();
      });
    });
    $stopSearch.click(function(event){
      $filter.val("");
      $(this).hide('fast');
      event.preventDefault()
      event.stopPropagation();

    });
    // Focus
    $filter.focus(function() {
      // animate
      $filter.animate({
        width: "285px"
      }, 200);
      $fSearchBg.removeClass("dark").addClass("light");
    });

  });

在我的情况下，我的输入框宽度为 140 像素，当用户关注输入框时，我将其设置为 284 像素，当我点击任何地方时，我正在处理模糊事件。现在我的要求是当我点击十字图标时输入框中有一个十字图标，我必须执行一些任务但我不想在点击十字图标时触发模糊。如果已经存在模糊事件，请建议我如何处理点击。

【问题讨论】：

标记上的十字图标是哪一个？
这是我用于十字图标和 $stopSearch.click(function(event){} ) 这里是事件。
你还能添加一个正确样式的小提琴吗？这将有助于加快寻找解决方案。
未经测试，但也尝试将模糊绑定到stopSearch。 $filter = $("#filter, #stopSearch")

标签： javascript jquery html css

【解决方案1】：

如果你能检测到图标点击设置一些全局 javascript 标志，如

iconclicked = true;

在 blur 方法中使用此图标单击，如果为真则返回

【讨论】：