2014-01-24 24 views
0

我正在爲谷歌瀏覽器創建一個文本替換擴展名,用戶可以輸入要替換的單詞以及他們想要替換的單詞。選項頁面應該是一個動態列表,如上所述,我可以在jsfiddle中添加框,但是當我用chrome打開選項頁面時,它不會添加任何新框或任何東西。動態列表工作在jsfiddle,但不在鉻

這裏是鏈接:http://jsfiddle.net/3K9jg/4/

或許這是與以下,但老實說,我不知道......

$("#add").click(function(e) { 
$("#wordreplacer").append($("#wordreplacer div.input:eq(0)").clone(true)); 
$("#wordreplacer div.input").eq(-1).find("input").val(''); 
e.preventDefault(); 
}); 

我敢新的JavaScript和搜索後幾周來,我仍然無法弄清楚爲什麼會發生這種情況。先謝謝您的幫助。

+0

這是一個擴展功能,添加設置頁面的功能?它做什麼呢?是否爲拼寫檢查器添加了特定的錯誤? –

+0

不,我有我自己的擴展選項頁面,所以我可以跟蹤我想替換的單詞。 – googlygoogly2

回答

0

你可以請嘗試下面的代碼。

<!DOCTYPE html> 
<html> 
<head> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
    <title> - jsFiddle demo</title> 

    <script type='text/javascript' src='/js/lib/dummy.js'></script> 



    <link rel="stylesheet" type="text/css" href="/css/result-light.css"> 

    <style type='text/css'> 

    </style> 



<script type='text/javascript'> 
    window.onload = function() { 
     var origList = []; 
     var replacementList = []; 

     var originalWord = document.getElementById("originalword"); 
     var replacementWord = document.getElementById("replacementword"); 
     var messageBox = document.getElementById("wordreplacer"); 

     function insert() { 
      origList.push(originalWord.value); 
      replacementList.push(replacementWord.value); 
     } 

     $("#add").click(function (e) { 
      $("#wordreplacer").append($("#wordreplacer div.input:eq(0)").clone(true)); 
      $("#wordreplacer div.input").eq(-1).find("input").val(''); 
      e.preventDefault(); 
     }); 
    } 

</script> 


</head> 
<body> 
    <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 
    <script class="jsbin" src="http://ajax.aspnetcdn.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script> 
<body> 
    <h3>Enter word and its replacement</h3> 
    <form id="wordreplacer"> 
    <div class="input"> 
     <input id="originalword" type="text" placeholder="Original Word" /> 
     <input id="replacementword" type="text" placeholder="Replacement Word" /> 
    </div> 
    </form> 
     <input type="button" id="add" value="Add" onclick="insert()" /> 

</body> 

</body> 


</html> 

我可以在點擊Add按鈕上添加框。請讓我知道這有助於。

+0

我認爲我的措辭令人困惑......我可以在谷歌瀏覽器中使用jsfiddle並點擊添加按鈕。但是,對於我的擴展,我有一個選項頁面,當我使用chrome中的開發人員模式將擴展加載到chrome並轉到我的選項頁面時,添加按鈕不起作用。 – googlygoogly2

相關問題