帮助中选择标签在HTML

问题描述：

<select onchange ="----"> 
<option value="a">a</option> 
<option value="b">b</option> 
<option value="c">c</option> 
</select>

我想写这个小小的一段代码wherien如果一个人选择任何项目，那么它应该移到显示正在选择什么样的价值在未来的HTML页面..帮助中选择标签在HTML

我怎样才能做到这一点..

希望我的疑问是明确

任何这里建议，将不胜感激......

谢谢..

答

<select onchange="document.forms[0].submit();">

假设它是页面上的第一个表单（通常是这样）。如果不是，您可以将索引更改为正确的格式。

一个很好的参考是Introduction to Forms。

您当然可以使用像jQuery这样的库（我的首选选项），但这是严格的可选的，因为它可以用股票标准的Javascript很容易地完成。

答

您是否正在寻找Javascript运行在用户的浏览器或某些服务器端解决方案？您只将此标记为“html”，因此不清楚“小代码”应该在哪种编程语言中...

答

onChange属性将接受javascript表达式或函数。因此，这取决于你想要做什么。如果您需要同一页面中的下拉列表的值，则可以使用JavaScript代码段访问它。

但是，如果您希望该值在后续页面（action属性点的表单）上可用，则需要在更改事件中提交表单。在这种情况下，您可以使用类似于@Cletus指出的内容。

答

所有表单字段都有一个form属性，您可以使用该属性轻松访问form元素以提交它。

您还需要select标记中的name属性，否则它不起作用。

<select name="item" onchange="this.form.submit();">

或者，你可以去到另一个页面通过设置窗口的位置，在查询字符串添加值：

<select onchange="window.location.href='NextPage.html?item='+this.options[this.selectedIndex].value;">

答

<select onChange="redirect(this)"> 
<option value="html1.html" selected>1</option> 
<option value="html2.html">2</option> 
<option value="html3.html">3</option> 
</select> 

<script type="text/javascript"> 
function redirect(selSelectObject) 
{ 
    if (selSelectObject.options[selSelectObject.selectedIndex].value != "") 
    { 
    location.href=selSelectObject.options[selSelectObject.selectedIndex].value 
    } 
} 
</script>

我希望这会帮助你。

答

你可以在select元素使用onchange做直列的Javascript ...但内联JS是一个坏习惯，应尽量避免。标记，即（X）HTML，应该是最小的和语义的，没有任何内联CSS或Javascript。尽可能多地将您的标记（HTML）与布局（CSS）和您的行为（Javascript）分开。

将您的Javascript保存在文档head中，或者更好的做法是将其作为head中调用的外部脚本。这既有利于保持标记清洁和最小化，又有助于集中和外化Javascript，从而促进代码重用和易于维护。

像jQuery这样的Javascript框架将使事情变得更加简单和更健壮，如果您对Javascript没有经验。

另外，请注意，这种方法（选择上的onchange）对于可访问性来说是糟糕的（尽管您在网上到处都可以看到它）。例如，很多只有键盘的用户（包括大量的手机）都面临可怕的情况，他们通过一次一个地选择列表中的一个选项来选择不同的选项......所以你的Javascript被踢了一次又一次地关闭，在初始选项和新选择的选项之间选择一次。丑陋 - 如果你实际上用onchange JS提交html表单，那么这些用户可能就是一个完整的showstopper。无论如何，你真的应该有一个单独的提交按钮（无Javascript的用户，搜索机器人等）; onchange JS可能会触发某些Ajax，但不要依赖它成为用户提交选择的唯一方式。

答

我建议您为跨浏览器兼容性考虑将下拉列表与按钮组合起来以调用“go to”操作。某些浏览器，尤其是与辅助功能技术一起使用时，会在滚动该项目时触发onchange进行选择。让onchange事件本身在这种情况下做回发将会适得其反。即使用户体验可能不尽如人意，但用户没有使用JavaScript并且用户使用辅助功能技术时，使用按钮的选择会更加优雅地降级。如果你通过AJAX加载内容，这将不那么重要，因为select可能仍然会在那里与之交互。然而，将全部回发到其他页面会挫败遇到此问题的用户。

帮助中选择标签在HTML

相关推荐