Question

我的网站上的其他网页上有以下代码，其中包含表单（例如页面 index.html ）：JSFiddle

<select class="select form-control" id="dropdown" name="dropdown" onchange="showForm()">

即下拉表格。

我希望在另一个网页上有一个链接，该链接将转到此页面，并拥有＆＃34;销售＆＃34;选项已被选中。

<option value="1">
    Sales
</option>

从下拉菜单（而不是当前默认选项），我该如何创建呢？

Answer 1

查询参数可用于实现您想要的结果，但您需要在当前页面上手动解析查询参数，因为没有标准的JavaScript方法。

您可以在页面上编写以下代码以自动选择选项：

$(document).ready(function() {
  // Parse your query parameters here, and assign them to a variable named `queryParams`
  var option = queryParams.type;
  $("#dropdown").val(option);
});

现在，您可以使用此页面的网址创建一个锚点，例如http://yourpage.url?type=1，会重定向到此页面，并会相应地自动更改下拉列表的值。

Answer 2

您必须在您的网站中使用Javascript添加某种路由器功能。

我认为最简单的事情就是在该页面中设置一个脚本来检查url是否有#bar哈希，如下所示：http://yoursite.com/foo.html#bar。

<script>
// make sure you run this on DOM ready like in $.ready() in jQuery or in a script just before closing the body tag

if(window.location.hash === 'bar') {
  // add the selected attribute to the <option> you want
}
</script>

Answer 3

尝试使用jquery的append()函数。并在onchange函数调用中传递this。还添加了document.ready，用于创建具有选定值的文档加载链接

＆＃13;

function showForm(that){
var s = $(that).children('option:selected').text()
$('#link_box').append('<a href="'+s+'">'+s+'</a></br>')
}
$(document).ready(function(){ // for window load
showForm($('select'))
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form-group ">
  <label class="control-label" for="dropdown">
				   What can we help you with?
				   
				  </label>
  <select class="select form-control" id="dropdown" name="dropdown" onchange="showForm(this)">
				   <option value="0" disabled>
			Select an option
					  </option>
				   <option value="1" selected>
					Sales
				   </option>
				   <option value="2">
					Complaints
				   </option>
				   <option value="3">
					Queries
				   </option>
				   <option value="4">
					Ideas
				   </option>
				  </select>
</div>
<div id="link_box">
<!-- its a link append  box-->
</div>

＆＃13;

如何创建预选表单选项的链接

3 个答案: