5

ここにこのテキストボックスがあります...

<input name="search" type="text" maxlength="512" id="search" class="searchField" autocomplete="off" title="" />

そして私もこの提出を持っています

<input type="submit" name="btnSearch" value="Search" onclick="location.href='http://www.website.com/search/';" id="btnSearch" class="buttonSearch" />

私がやろうとしているのは、私のテキストボックスにあるものをすべて追加することです

onclick="location.href='http://www.website.com/search/';"

だからこのようになります。

onclick="location.href='http://www.website.com/search/what ever the user searches';"

どうやってこれをやろうか、私は私の小さな心をグーグルで探していました。

4

5 に答える 5

11

JavaScriptとHTMLを混在させないでください。属性を削除onclickして、DOMがロードされた後のどこかでプレーンJavaScriptでこれに置き換えることができます。

document.getElementById('btnSearch').onclick = function() {
    var search = document.getElementById('search').value;
    var searchEncoded = encodeURIComponent(search);
    window.location.url = "http://www.website.com/search/" + searchEncoded;
}

また、検索ボックスをエスケープすることについても覚えておいてください。たとえば、を使用しencodeURIComponent()ます。これが実際のjsfiddleの例です。

于 2012-06-07T19:47:41.463 に答える
10

これはうまくいくはずです：

onclick="location.href='http://www.website.com/search/'+document.getElementById('search').value;"

しかし、タグに直接スクリプトを書くことは悪い習慣であるため、私のプロジェクトの1つにそれを書くことは決してありません。

于 2012-06-07T19:44:41.697 に答える
1

これが動作するjsfiddleです

より保守しやすいので、イベントハンドラーをボタンの外に移動しました。また、サーバーに正しく到達するように検索クエリをエンコードします。

var search = document.getElementById('search');
var submit = document.getElementById('btnSearch');

submit.addEventListener('click', function(e) {
    var searchValue = encodeURIComponent(search.value);  // encode the search query
    window.location.href = 'http://www.website.com/search/' + searchValue ;
});
于 2012-06-07T19:46:33.400 に答える
0

次のようにonclickイベントに追加できます

document.getEelementById("btnSearch").onclick = function(){
    location.href='http://www.website.com/search/' + document.getEelementById("search").value;
}

編集：aaaaand遅すぎる...まあ。少なくともこれはインラインではありません。

于 2012-06-07T19:45:46.460 に答える
0

このタスクには <script> タグを使用することをお勧めします。例：

<input name="search" type="text" maxlength="512" id="search" class="searchField" autocomplete="off" title="" />
...
<input type="submit" name="btnSearch" value="Search"  id="btnSearch" class="buttonSearch" />
<script type="text/javascript">
var button= document.getElementById('btnSearch');
button.onclick= function(){
    var text= document.getElementById('search').value;
    location.href='http://www.website.com/search/'+text;
}
</script>

ただし、テキストボックスのテキストを少し「きれいにする」ようにして、それを URL に追加すると有効な URL が得られるようにする必要があります。テキストをトリミングしてから、特殊文字を検索してエスケープする必要があります。

于 2012-06-07T19:49:21.760 に答える