從文本框中打開url

Question

我正在通過文本框打開url的腳本，下面是我迄今爲止正在處理的代碼及其失敗的代碼。

<form id="main" name="main"> 
    <input type="text" name="inputtext" id="inputtext" placeholder="type here"/> 
    <input type="submit" value="submit" onClick="test();"> 
</form> 
<script> 
function test() { 
    $("main").submit(function(e) { 
     if($('inputtext').val() == 'google'){ 
      // alert('Input can not be left blank'); 
      window.location.href = "https://www.google.com/"; 
     } 
     if($('inputtext').val() == 'yahoo'){ 
      // alert('Input can not be left blank'); 

      window.location.href = "https://www.yahoo.com/"; 
     } 
     if($('inputtext').val() == ''){ 
      alert('Input can not be left blank'); 
     } 
    }); 
} 
</script> 

請諮詢我，如果我錯了工作路徑上還是歡迎使用javascript

Answer 1

<form id="main" name="main" method="POST"> 
     <input type="text" name="inputtext" id="inputtext" placeholder="type here"/> 
     <input type="button" value="submit" onClick="test();"> 
    </form> 

<script> 
function test() { 
    if(jQuery('#inputtext').val() == 'google'){  

     window.location.href = "https://www.google.com/"; 

    }else if(jQuery('#inputtext').val() == 'yahoo'){ 
    // alert('Input can not be left blank'); 

    window.location.href = "https://www.yahoo.com/"; 

    }else if(jQuery('#inputtext').val() == ''){ 
    alert('Input can not be left blank'); 
    }else if(jQuery('#inputtext').val() != ''){ 
    alert("INVALID"); 
    } 

} 
</script> 

Answer 2

你的jQuery選擇語法是錯誤的任何建議。要通過其ID選擇一個元素，請在其之前放置一個#。

<form id="main" name="main"> 
     <input type="text" name="inputtext" id="inputtext" placeholder="type here"/> 
     <button onClick="test();">Submit</button> 
    </form> 

<script> 
function test() {  

      if($('#inputtext').val() == 'google'){ 
       // alert('Input can not be left blank'); 

      window.location.href = "https://www.google.com/"; 

      } 
     if($('#inputtext').val() == 'yahoo'){ 
       // alert('Input can not be left blank'); 

      window.location.href = "https://www.yahoo.com/"; 

      } 
      if($('#inputtext').val() == ''){ 
       alert('Input can not be left blank'); 



      } 
} 
</script> 

Answer 3

您有錯誤的選擇器。難怪你的代碼無法正常工作。 更改$('inputtext').val()分爲以下幾個選擇

所以，如果你想通過其ID的目標元素：

$('#inputtext').val() 

，如果你想通過它的類型來定位元素：

$('input[type="text"]').val(); 

，如果你想目標元素按其類別劃分：

$('.sampleclass').val() 

如果您想要ta它的名字rget元素：

$('input[name="inputtext"]').val() 

Answer 4

1）你錯過＃運營商在你的jQuery電話..，

2）改變你的輸入型submit爲button，

3）刪除形式功能，

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
<form id="main" name="main"> 
 
     <input type="text" name="inputtext" id="inputtext" placeholder="type here"/> 
 
     <input type="button" value="submit" onClick="test();"> 
 
    </form> 
 

 
<script> 
 
function test() { 
 
      if($('#inputtext').val() == 'google'){ 
 
       // alert('Input can not be left blank'); 
 
      console.log('yes') 
 
      window.location.href = "https://www.google.com/"; 
 

 
      } 
 
     if($('#inputtext').val() == 'yahoo'){ 
 
       // alert('Input can not be left blank'); 
 

 
      window.location.href = "https://www.yahoo.com/"; 
 

 
      } 
 
      if($('#inputtext').val() == ''){ 
 
       alert('Input can not be left blank'); 
 
      } 
 
} 
 
</script>

Answer 5

一個純JavaScript解決辦法來做到這一點：

var form = document.getElementById('form'); 
 
var input = document.getElementById('url'); 
 

 
form.onsubmit = function(e) { 
 
    e.preventDefault(); 
 
    
 
    switch(input.value) { 
 
    case 'google': 
 
     window.location.href = 'http://google.com' 
 
    break; 
 
    case 'yahoo': 
 
     window.location.href = 'http://yahoo.com' 
 
    break; 
 
    default: 
 
    alert('nope'); 
 
    break; 
 
    } 
 
}

<form id='form'> 
 
    <input type='text' id='url'> 
 
    <input type='submit' value='Go To'> 
 
</form>