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'); 
      }); 
     }); 
    }); 
}); 

HTML：

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

感謝您的幫助

Answer 1

這是因爲firefox在type屬性之前添加了value屬性，所以您的regexp不匹配。

試着改變你的代碼：

$(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;

，這將阻止這樣的錯誤並檢查輸入是否存在於不同的瀏覽器中。