jquery - Firefox 上的 Jquery 错误，但 Chrome 上没有

Question

我试图在单击该 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');
          });
       });
  });
});

网页：

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

谢谢您的帮助

Answer 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/

Answer 2

当您可以将其替换为时，为什么要使用该test()功能

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

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