使用<span>進行表單提交按鈕重定向到新網站

我需要提交下面的表單並將網頁重定向到另一個網站，以根據輸入的searchString顯示搜索結果。使用<span>進行表單提交按鈕重定向到新網站

<a href="#" class="button search"> 
    <span class="spanclass"></span> 
    <input class="expand" name="searchString" type="text"> 
    <span id="searchButton" class="search icon-small open-btn"></span> 
</a>

我在想如何使用javascript，jquery或ajax來處理它。請提供您寶貴的意見。由於我有提交按鈕作爲跨度，我不知道如何使用它來提交表單。預先感謝大家提供有價值的信息。

來源

2015-12-29 Sandeep Rawat

內聯JS的解決方案

<span id="searchButton" class="search icon-small open-btn" onclick="document.forms['form-name'].submit();"></span>

但因爲你還包括你的問題的jQuery標籤:)

$(document).ready(function(){ 
    $('#searchButton').click(function(){ 
    $("#form-id").submit(); 
    }); 
})

來源

2015-12-29 06:45:14 gurvinder372

使用jQuery附加一個onlclick功能的跨度，並提交功能

腳本里面的形式：

$(document).ready(function(){ 
$('#searchButton').click(function(){ 
$("form").submit()//assuming you have a form tag with an action specified 
}) 
})

來源

2015-12-29 06:44:18

var SearchedItem=$(".expand").text();  

$.ajax({ 
    type: "POST", 
    async: false, 
    dataType: 'json', 
    url: "/MyController/Index", 
    contentType: 'application/json', 
    // processData: false, 
    data: JSON.stringify({ SearchedItem: SearchedItem}), 
    success: function (data) { 
     ... 
    } 
});

來源

2015-12-29 06:44:31

代碼不堆棧工作，因爲在iframe同源策略的

$(function(){ 
 
    var searchString = $('.expand'), 
 
     searchButton = $('#searchButton'); 
 
    
 
    searchButton.on('click', function(e){ 
 
    window.location.href = searchString.val(); 
 
    }); 
 
})

* { 
 
    box-sizing: border-box; 
 
} 
 

 
.search-box { 
 
    width: 300px; 
 
    height: 2em; 
 
} 
 

 
.expand { 
 
    width: 260px; 
 
    height: 100%; 
 
    float: left; 
 
} 
 

 
.search { 
 
    width: 40px; 
 
    height: 100%; 
 
    background: teal; 
 
    float: left; 
 
    cursor: pointer; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="search-box"> 
 
<input class="expand" name="searchString" type="text" value="http://google.com"> 
 
<span id="searchButton" class="search icon-small open-btn"></span> 
 
</div>

來源

2015-12-29 06:49:36 synthet1c

的onclick事件只需添加的元素：

<span id="searchButton" class="search icon-small open-btn" onclick="location.href = 'www.yoursite.com';"></span>

你也可以在JavaScript塊中這樣做。

<script type="text/javascript"> 
document.getElementById("searchButton").onclick = function() { 
     location.href = "www.yoursite.com"; 
    }; 
</script>

來源

2015-12-29 06:50:27 shishir

如果你正在尋找提交表單，而span是這種形式中，一個label實際上沒有涉及JS幫助，以及跨瀏覽器支持：

<label> 
    <span id="searchButton" class="search icon-small open-btn"></span> 
    <input type="submit" style="display:none"/> 
</label>

製作確保標籤內存在提交輸入字段（input type=submit），否則只要存在，就使用for屬性和id字段。

來源

2016-10-26 13:07:22

使用<span>進行表單提交按鈕重定向到新網站

回答

相關問題