我想知道是否有人使用转换HTML的JQuery插件有任何经验

<select> 
  <option> Blah </option> 
</select>

将组合框放到某物(可能是div)中，在其中选择项目的行为与单击链接相同。

我想我们可能可以使用javascript处理选择事件(目前我的javascript知识还有些失修)并"切换"组合框的值，但这似乎更像是一种hack。

建议，经验和建议将不胜感激。

解决方案

回答

javascript中的"选择"部分：

onchange="if(this.options[this.selectedIndex].value!=''){this.form.submit()}"

这不是很理想(因为我正在使用的ASP.NET MVC中的表单提交似乎没有使用URL的路由引擎)，但是它确实可以做到。

回答

当我们单击Div时，我不确定我们要链接到的位置，但是给出如下所示的方法可能会起作用：

<select id="mySelect">
  <option value="1">Option 1</option>
  <option value="2">Option 2</options>
</select>
<div id="myDiv"/>

然后下面的JQuery创建一个<div>元素列表，一个基于选项值的URL：

$("#mySelect option").each(function() {
    $("<div>" + $(this).text() + "</div>").appendTo($("#myDiv")).bind("click", $(this).val(), function(event) {
        location.href = "goto.php?id=" + event.data;
    });
});
$("#mySelect").remove();

这是我们想要的吗？

回答

简单的解决方案是使用

$("#mySelect").change(function() {
  document.location = this.value;
});

这将在选择框上创建一个onchange事件，该事件会将我们重定向到存储在所选选项的value字段中的url。

回答

如果要有很多选择框希望允许它们用作重定向，而不必单独定义它们，请尝试类似的方法：

$("[id*='COMMON_NAME']").change(function() {
    document.location = this.value;
});

并相应地命名选择框：

<select id="COMMON_NAME_001">...</select>
<select id="COMMON_NAME_002">...</select>

这将为所有包含" COMMON_NAME"的ID创建一个onchange事件，以对<option>值进行重定向。