如何在不提交按鈕的情況下從文本字段調用JavaScript函數？

我已經用一些JavaScript代碼創建了一個HTML頁面。這裏是代碼如何在不提交按鈕的情況下從文本字段調用JavaScript函數？

<script type="text/javascript"> 
    function doIt(){ 
     window.location = document.getElementById('url').value; 
    } 
    </script> 
    <input type="text" id="url" />

我想，當有人按下輸入後鍵入的URL。該頁面自動重定向到給定的URL。我怎麼能做到這一點？請給我建議一些代碼

來源

2012-01-05 Rizwan Khan

你熟悉的jQuery？ – c0deNinja 2012-01-05 18:06:52

使用下面的代碼：

<html> 
<html> 
<head> 
<script type="text/javascript"> 
    function doIt(){  
     window.location.href = document.getElementById('url').value; 
    } 
    document.onkeypress=function(e){ 
     var e=window.event || e;   
     if(e.keyCode===13) doIt();  
    } 
</script> 
</head> 
<body> 
<input type="text" id="url" value="http://www."/> 
</body> 
</html>

來源

2012-01-05 18:15:20

您將'keypress'附加到'document''元素。這不是理想的解決方案... – xandercoded 2012-01-05 18:22:44

@Xander，你的代碼是正確的。但是，我的理解很簡單。無論如何，你是開放的說你是正確的，當沒有人說你錯了:) – 2012-01-05 18:52:14

您需要將一個按鍵事件處理程序附加到文本框。在你的事件處理程序中，你會檢查按下的鍵是否被輸入。如果是這樣，請重新定向。查找事件處理程序。

來源

2012-01-05 18:06:15 Fantius

你能幫我推薦一些幫助代碼嗎？ – 2012-01-05 18:07:32

@rizwan jQuery！ – 2012-01-05 18:08:39

如果你不使用jQuery，下面是一個完整的例子：

function addEvent(obj, type, fn) { 
    if (obj.attachEvent) { 
     obj['e' + type + fn] = fn; 
     obj[type + fn] = function() { 
      obj['e' + type + fn](window.event); 
     } 
     obj.attachEvent('on' + type, obj[type + fn]); 
    } else obj.addEventListener(type, fn, false); 
} 

addEvent(window, 'load', function() { 
    addEvent(document.getElementById('url'), 'keyup', function(e) { 
     var code = (e.keyCode ? e.keyCode : e.which); 

     if (code == 13) 
      window.location.href = this.value; 
    }); 
});

例 - http://jsfiddle.net/4PDt4/

學分爲的addEvent代碼片段： - http://ejohn.org/projects/flexible-javascript-events/

來源

2012-01-05 18:07:20 xandercoded

我覺得還有'onblur'。 – 2012-01-05 18:10:27

我如何在我的代碼中使用這個函數？可以請舉個例子嗎？ – 2012-01-05 18:10:29

@Xander應該使用jquery文件嗎？ – 2012-01-05 18:14:41

看現場演示http://jsfiddle.net/qiao/RGqwD/2/

var input = document.getElementById('url'); 
input.onkeydown = function(e) { 
    var key = e.keyCode || e.which; 
    if (key == 13) { 
     window.location = input.value; 
    } 
};

來源

2012-01-05 18:10:18 qiao

這裏是解決方案：http://jsfiddle.net/YBLQx/1/

(function() { 

    var textField = document.getElementById('foo'); 

    function addHandler(el, event, handler) { 
     if (el.addEventListener) { 
      el.addEventListener (event, handler, false); 
     } else if (el.attachEvent) { 
      el.attachEvent (event, handler); 
     } 
    } 

    addHandler(textField, 'keydown', textEntered); 

    function textEntered(event) { 
     if (event.keyCode === 13) { 
      window.location = textField.value; 
     } 
    } 
}());

HTML

<input type="text" id="foo" />

此致敬禮！

來源

2012-01-05 18:16:27

<input type="text" id="url" onblur="window.location.href='this.value'" />

以上是聚焦是否取出，像壓片

，然後輸入，寫onkeydown事件處理程序

<script type="text/javascript"> 
    document.getElementById('url').onkeydown = function(e) { 
     var keyCode = e.keyCode || e.which; 

    if (keyCode === 13) { 
     window.location.href = this.value; 
    } 
} 


</script>

來源

2012-01-05 18:17:34

如何在不提交按鈕的情況下從文本字段調用JavaScript函數？

回答

相關問題