輸入觸發按鈕點擊？

-1

<form name="f1"> 
<center> 
<strong>Search VMs:</strong> 
<input id='vms' name="word" type="text" size="50" placeholder="Name or IP, space delimited, partial name OK." autofocus autocomplete="off" pattern=".{3,}" required title="3 chars minimum" /> in 
<select name="vc" id='whichvc'> 
    <option value="all" selected="selected">all VCs</option> 
</select> 
<input type="checkbox" id="check4detail" name="detail">Include details 
<input name='searchbutton' value="Search VMs" type="button" onclick='xmlhttpPost("/cgi-bin/search-vm.pl")' /> 
<input value="Clear" type="button" onclick="clearBox('result')" /> 
</center> 
</p> 
<div id="loading"></div> 
<div id="result"></div> 
</form>

正如你所看到的，有一個文本輸入框和其他幾個按鈕，其中一個具有關聯一個的onclick（）偵聽器。當用戶輸入文本並按回車鍵時，如何觸發該按鈕上的onclick事件？

試圖從論壇這一解決方案，但它在某種程度上不工作：

$('#vms').keypress(function(event){ 
if (event.which === 13){ 
$('#searchbutton').click();} 
});

BTW，當我在字段中輸入文字，點擊搜索按鈕，它工作得很好。但是輸入文本並按回車不會以某種方式觸發搜索事件。

來源

2017-02-02 zagpoint

我不認爲jQuery的事件觸發非jQuery的聽衆，不是嗎？ – mhodges

@mhodges如果你的意思是'$（'＃searchbutton'）。click（）;'觸發'onclick'屬性中的函數。簡單演示：https：//jsfiddle.net/v11y6kab/。 ['trigger']（http://api.jquery.com/trigger/）文檔中的詳細信息。 –

[在文本框的Enter鍵上用JavaScript觸發一個按鈕單擊]的可能重複（http://stackoverflow.com/questions/155188/trigger-a-button-click-with-javascript-on-the-enter -key-in-a-text-box） –

更改按鈕的類型爲submit。在同一表單中的某個編輯中按下提交按鈕時，提交按鈕會按下回車鍵。在下面的例子中，你可以測試它。將光標置於編輯框中並按下回車鍵。你應該得到一個警報。

<form action="" method="get" onsubmit="return false;"> 
 
Test field: <input type="text" name="test"><br> 
 
<button type="submit" value="Submit" onclick="alert('it works!');">Submit</button> 
 
<button type="reset" value="Reset">Reset</button> 
 
</form>

注意，這是一個瀏覽器實現細節。我不知道任何瀏覽器都無法運行，但同時我不能保證它可以在任何瀏覽器和任何平臺上運行。

來源

2017-02-02 23:09:27 GolezTrol

不能這樣做，因爲我試圖避免頁面重新加載。 – zagpoint

您可以使用JavaScript在表單的onsubmit事件中阻止頁面重新加載。有了額外的好處，你可以在非JavaScript環境中獲得頁面重新加載，你應該關心它。 – GolezTrol

關於如何創建onsubmit（）偵聽器來防止頁面重新加載，需要詳細說明一下（最好是用一些示例代碼;-)）。 – zagpoint

-1

您應該使用

<button onclick="myFunction()"> 
    <script> 
    function myFunction() { 
     document.getElementById("field2").value = document.getElementById("field1").value; 
    } 
</script>

來源

2017-02-02 23:14:04 Diamant

變化$('#searchbutton').click();到$('#searchbutton').trigger('click');

來源

2017-02-02 23:55:19

不幸的是，這並沒有改變行爲 - 搜索仍然沒有發生.. – zagpoint

修改@GolezTrol代碼，以便在輸入文本字段的onChange聽衆間接觸發搜索按鈕的點擊。

<form action="" method="get"> 
 
    Test field: 
 
    <input type="text" name="test" onChange="aliasonclick"> 
 
    <br> 
 
    <button name="searchbutton" id="clickthis" onclick="alert('it works!');">Submit</button> 
 
    <button type="reset" value="Reset">Reset</button> 
 
</form> 
 

 
<script> 
 
    function aliasonclick() { 
 
    var searchbutton = document.getElementById("clickthis") 
 
    searchbutton.click() 
 
    } 
 
</script>

來源

2017-02-03 00:35:38

你測試過了嗎？代碼段不起作用。 – GolezTrol

是的，我在Chrome瀏覽器上工作。每當我選擇文本字段並按下回車鍵，我會看到一個警告對話框。 –

好的。現在工作。如果你這樣做，你可以完全刪除表單標籤，這很好，因爲OP不想形成任何事情。 – GolezTrol

輸入觸發按鈕點擊？

回答

相關問題