2011-09-10 10 views
0

<div>の内容を文字列の正規表現.match()の結果と置き換える方法を理解しようとしています。これは私がこれまでに持っているコードですが、動作させることはできません。ボタンを画面上に残したいが、一致する単語を反映させるには<div>としたい。divの内容を文字列の正規表現と置き換えてください

<html> 
<body> 
    <script type="text/javascript"> 
    function search(){ 
     var str = "Visit W3Schools"; 
     var patt1 = /w3schools/i; 
     document.write(str.replace(document.getElementById("results"), 
            (str.match(patt1)))); 
    } 
    </script> 
</body> 

<div id="results">So this is some text.</div> 
<button name="Search" onclick="search()">Click Here</button> 
</html> 

なぜ機能していないのでしょうか?

答えて

2

デフォルトのイベント(ページを送信する)を完了するには、ボタンを停止する必要があります。 (編集:それはないですいいえ、デフォルトのイベントは何もありません - それは:) <submit>だったと仮定)

また、それはあなたがdocument.getElementById('id-of-element')を使用するとの内容を設定するために、id属性だ上で、文書の基本からdiv要素を取得しますdivには、今取得した要素に.innerHTMLを使用します。

// We need to take the event handler as a parameter for the function, let's call it e 
function search(e){ 
    var str = "Visit W3Schools"; 
    var patt1 = /w3schools/i; 
    document.getElementById("results").innerHTML = str.match(patt1)[0]; 
    // This line stops the default action occurring 
    e.preventDefault(); 
} 

注:私たちは、eは自動的に

<button name="Search" onclick="search()">Click Here</button> 
+0

が提出からボタンを防ぐために、あなただけのbutton' 'にその' type'が属性を設定することができます。 –

1

document.writeに入り、ここで引数を指定する必要はありませんが、パラメータに渡されて、ページ全体を置き換えます。つまり、その単一のDIV、resultsを更新したいだけです。ですから、innerHTMLを使用したい:

function search() { 
    var str = "Visit W3Schools"; 
    var patt1 = /w3schools/i; 
    document.getElementById("results").innerHTML = str.match(patt1)[0]; 
} 
1

あなたのコードは、文字列"Visit W3Schools"のString "So this is come text."を検索し、その後、アレイ["W3Schools"]、画面に書き込むと、それを置き換えています。これはあまり意味がありません。

は、この代わりのようなものを試してみてください:

function search(){ 
    var str = "Visit W3Schools"; 
    var patt1=/w3schools/i; 
    document.getElementById("results").innerHTML=(str.match(patt1))[0]; 
} 
関連する問題