Firefox 上的 Jquery 错误，但 Chrome 上没有答案

【问题标题】：Jquery bug on firefox but not on ChromeFirefox 上的 Jquery 错误，但 Chrome 上没有
【发布时间】：2013-10-18 19:29:07
【问题描述】：

单击该 div 时，我试图在该 div 的位置加载一个输入框，我使用的 Jquery 在 Chrome 上运行良好，但是当进入 Firefox 时，它在 1、2 和 3 之后显示不同的结果点击次数：

这是我正在使用的 Jquery：

$(function(){
  $('#right').on('click', '.stock.mini-counts', function(){
    var $p = $(this);
    var old = $p.html();

    if(/<input type="text"/.test(old))
      return;

    $p.html('<input type="text" value="' + old + '"/>')
       .find('input')
       .focus()
       .on('blur', function(){
         var value = this.value;
         $.post('listener_updates.php', {stock: value})
          .done(function(){
            $p.html(value);
          })
          .fail(function(){
            $p.html(old);
            alert('Could not update title');
          });
       });
  });
});

HTML：

<div class="status"><div class="stock mini-counts">7</div><div>available</div></div>

感谢您的帮助

【问题讨论】：

HTML 是什么样的？
@putvande，我添加了 HTML，谢谢。
你可以为你的代码创建一个 jsfiddle 吗？

标签： jquery html google-chrome firefox

【解决方案1】：

这是因为firefox在type属性之前添加了value属性，所以你的正则表达式不匹配。

尝试更改您的代码：

$(function () {
    $('#right').on('click', '.stock.mini-counts', function(){
        var $p = $(this);
        var old = $p.html();

        if (/<input /.test(old)) return;
        $p.html('<input type="text" value="' + old + '"/>')
            .find('input')
            .focus()
            .on('blur', function () {
            var value = this.value;
            $p.html(value);

        });
    });
});

演示：http://jsfiddle.net/IrvinDominin/aAAh8/

【讨论】：

【解决方案2】：

为什么要使用 test() 函数，因为您可以将其替换为

if( $(this).find('input').length > 0 ) return false;

这将防止此类错误并检查输入是否存在于浏览器中。

【讨论】：