腳本將變量替換爲文檔中的值

我想要進行以下操作：從文本輸入中獲取值，然後檢查是否在整個文檔中出現第一個值。如果它出現在文檔中，我想用第二個變量的值替換它的所有實例。腳本將變量替換爲文檔中的值

Snipet中的代碼不正確導致函數替換不起作用... 有沒有人知道如何解決它？

預先感謝您！

$(document).ready(function(){ 
 
    var replaced = $('#replaced').val(); 
 
    var modified = $('#modified').val(); 
 
    
 
    $('#submit').click(function(){ 
 
     if($(".entireSite:contains(" + replaced + ")").text() === '') { 
 
      alert('there is no wanted word/phrase at the website'); 
 
     } else { 
 
      $('.entireSite').text().replace(replaced, modified); 
 
     }; 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
<input type="text" id="replaced" value="word/phrase to modify"><br><br> 
 
<input type="text" id="modified" value="new word/phrase"><br><br> 
 
<input type="submit" value="submit" id="submit"> 
 
    
 
<div class="entireSite">  
 
<p>Lorem ipsum dolor sit amet, consectetur 
 
    adipiscing elit. Maecenas sed sollicitudin 
 
    lectus. Sed libero tellus, sodales quis eros 
 
    eu, vestibulum interdum nibh. Nunc Lorem quis 
 
    diam vitae enim finibus pretium ut a ipsum. 
 
    Cras ut ullamcorper mi, vel fringilla augue. 
 
    Pellentesque Lorem consequat vulputate ipsum 
 
    sit amet faucibus. Aliquam erat orci, cursus 
 
    id tempor bibendum, condimentum vitae enim.</p> 
 
</div> 
 
</body> 
 
</html>

來源

2017-09-21 Bix

發生這種情況是因爲您只在文檔加載時設置變量「替換」和「修改」，而不是當你點擊按鈕時。這是對@Phani Kumar M的回答的解釋。

來源

2017-09-21 11:50:30 kcode

謝謝你的支持。它工作正常！ – Bix

作爲的.text（）是一個函數（返回一個值）要更換價值的文本的副本。您應該保存該結果（例如，保存在名爲replacedText的變量中）並使用.text（replacedText）重新賦值

來源

2017-09-21 11:47:36 Gerard

這裏我們開始吧！

我固定在你的代碼的一些問題，這樣就可以做到這一點^^

$(document).ready(function(){ 
 

 
    var toReplace = $('#toReplace'); 
 
    var replaceWith = $('#replaceWith'); 
 
    var par = $('.entireSite p'); 
 
    
 
    $('#submit').click(function(){ 
 
    
 
    var one = toReplace.val(); 
 
    var two = replaceWith.val(); 
 
    while(par.text().indexOf(one) != -1){ 
 
    var txt = par.text(); 
 
    par.text(txt.replace(one,two)); 
 
    } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
<input type="text" id="toReplace" placeholder="word/phrase to modify"><br><br> 
 
<input type="text" id="replaceWith" placeholder="new word/phrase"><br><br> 
 
<input type="button" value="submit" id="submit"> 
 
    
 
<div class="entireSite">  
 
<p>Lorem ipsum dolor sit amet, consectetur 
 
    adipiscing elit. Maecenas sed sollicitudin 
 
    lectus. Sed libero tellus, sodales quis eros 
 
    eu, vestibulum interdum nibh. Nunc Lorem quis 
 
    diam vitae enim finibus pretium ut a ipsum. 
 
    Cras ut ullamcorper mi, vel fringilla augue. 
 
    Pellentesque Lorem consequat vulputate ipsum 
 
    sit amet faucibus. Aliquam erat orci, cursus 
 
    id tempor bibendum, condimentum vitae enim.</p> 
 
</div> 
 
</body> 
 
</html>

來源

2017-09-21 12:07:57

非常感謝你。這對我的代碼也很有用。 – Bix

所以upvoting或標記爲答案應該是好的 –

你可以像這樣做，

HTML：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

<body> 
    <input type="text" id="replaced" value="Lorem"> 
    <br> 
    <br> 
    <input type="text" id="modified" value="Parag"> 
    <br> 
    <br> 
    <input type="submit" value="submit" id="submit"> 

    <div class="entireSite"> 
    <p id="finalResult">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed sollicitudin lectus. Sed libero tellus, sodales quis eros eu, vestibulum interdum nibh. Nunc Lorem quis diam vitae enim finibus pretium ut a ipsum. Cras ut ullamcorper mi, vel fringilla 
     augue. Pellentesque Lorem consequat vulputate ipsum sit amet faucibus. Aliquam erat orci, cursus id tempor bibendum, condimentum vitae enim.</p> 
    </div> 
</body>

個JS：

$(document).ready(function() { 
    $('#submit').click(function() { 
    var replaced = $('#replaced').val(); 
    var modified = $('#modified').val(); 
    var finalText = $('#finalResult').text(); 

    if (finalText.indexOf(replaced) >= 0) { 
     var temp = new RegExp(replaced, "g"); 
    $("#finalResult").text(finalText.replace(temp, modified)); 
    } 
    }); 
});

這裏有一個FIDDLE一起玩。

來源

2017-09-21 12:11:15

腳本將變量替換爲文檔中的值

回答

相關問題