使用HTML下拉选择重定向
Redirect with HTML dropdown select
我有一个简单的HTML下拉选择框。
我希望这能起到"一旦选择了某个内容">页面重定向到自定义URL的作用
下面是我的标记
<fieldset id="size"><legend>Product Options</legend>
<div class="wpsc_variation_forms">
<table>
<tr><td class="col1"><label for="variation_select_48_5">Choose Size:</label></td>
<td class="col2"><select class="wpsc_select_variation" name="variation[5]" id="variation_select_48_5">
<option value="0" >-- Please Select --</option>
<option value="8" >Large</option>
<option value="7" >Medium</option>
<option value="6" >Small</option>
</select></td></tr>
</table>
</div><!--close wpsc_variation_forms-->
</fieldset>
我发现了一个类似的问题;但给出的解决方案似乎有点笨拙。
SELECT Dropdown在没有Javascript 的情况下重定向
使用jQuery:
$(function() {
$('#variation_select_48_5').change(function() {
document.location = 'http://customurl.abc';
});
});
我所知道的最简单的方法是分配一个onchange
事件来选择元素,并将选项的值设置为url。
<select onchange="window.location = this.options[this.selectedIndex].value;">
<option value="http://your-url">Large</option>
</select>
我会编写一个litte函数,然后根据返回的结果触发它
<?PHP
function redirect($where){
header("Location: $where");
}
if ($_REQUEST['select1'] == '8'){
redirect('http://example.com/somewhere.php');
}elseif($_REQUEST['select1'] == '7'){
redirect('http://example.com/elsewhere.php');
}elseif($_REQUEST['select1'] == '6'){
redirect('http://example.com/elsewhere.php');
}
?>
<form>
<select name="select1" class="wpsc_select_variation" name="variation[5]" id="variation_select_48_5" onchange="this.form.submit()">
<option value="0" >-- Please Select --</option>
<option value="8" >Large</option>
<option value="7" >Medium</option>
<option value="6" >Small</option>
</select>
唯一需要的javascript是在select
标记内触发提交onchange="this.form.submit()"
希望这能帮助
$("select#wpsc_select_variation").change(function(){
if ($(this).val() !== 0) {
switch($(this).val())
{
case(8):
window.location.href = http://www.8.com
case(7):
window.location.href = http://www.7.com
case(6):
window.location.href = http://www.6.com
}
}
});
相关文章:
- 在选择时自动重定向
- 当用户在选择框中选择选项时,使用window.location.href重定向用户只会更改导航器中URL的最后一位
- 基于单选/选择选项重定向
- 根据选择选项元素将表单重定向到不同的URL,并在电子邮件中获取表单详细信息
- 如何根据选择下拉列表从表单重定向到 URL
- 链接内的内容可编辑块,如何防止重定向,但让文本选择插入符号位置更改
- 选择其中一个单选按钮,然后单击“提交”,重定向其他页面
- 重定向后选择选项
- 选择选项“重定向获取值”和“在重定向页面上显示”
- 如何基于两个下拉菜单选择进行页面重定向
- 如何让我的重定向脚本添加一个随机后缀来选择网站
- 在选择标记中的 ng 更改上重定向
- 如何根据 html 中的选项/选择重定向用户(单击按钮后)
- 要重定向的页面取决于多个“选择”选项
- 在jQuery Mobile中更改大选择菜单时重定向
- Javascript:根据单选按钮选择重定向到新页面
- 使用HTML下拉选择重定向
- 如何根据表单选择重定向人员
- 根据选择重定向到新的网页
- 使用 javascript 根据条件表单字段选择重定向感谢消息