选择$ this，显示$ that - 如何使用表单进行操作？

我有一个用户可以填写的很多选项（名称，电子邮件等）的HTML表单，然后我将有一个下拉框，要求用户选择“样式A”或“样式B”。

如果“A款”被拾取，然后会有这种风格的具体尺寸，如果“B型”被选中，那么就会有具体的尺寸为这种风格等

但是，我是一个当涉及到任何过去的xhtml/css和最小的PHP/javascript（非常小）时，完成noob，所以我不确定如何完成此任务。当用户选择样式a/b或者用户是否必须选择样式，单击提交并且另一个表单加载时，这些选项是否会显示？我不确定如何做到这一点，所以在我的书中有任何作品！

任何人都可以帮我解决问题吗？

非常感谢任何帮助。

来源

2011-08-04 Alex S

[Two Dynamic Drop Downs]的副本（http://stackoverflow.com/questions/4445322/two-dynamic-drop-downs） –

你可以用Javascript完全做到这一点。样式'A'将是一个类（或一组类），样式'B'将是另一个类（或集）。

当用户选择样式'A'时，运行所有您想要更新的元素以及样式'A'中的相应类。如果用户选择样式'B'，则对其执行相同的操作。

HTML

<select id = 'styler' name = 'styler'> 
    <option value = 'a'>Style A</option> 
    <option value = 'b'>Style B</option> 
</select>

的Javascript

（使用jQuery为简单起见）

$(function() { 
    $('#styler').bind("change", function() { 
     if($(this).val() == 'a') 
      $(".bClass").removeClass("bClass").addClass("aClass"); 
     else 
      $(".aClass").removeClass("aClass").addClass("bClass"); 
    }); 
});

来源

2011-08-04 16:47:10

的一个好方法是将有在表单这样的容器如：网页上

div.styleA input 
div.styleB input

最后，使用jQuery，假设你有一个具有此值的选项的选择栏：

<div id="style_container" class="styleA"> 
    <form> .. </form> 
</div>

然后你就可以在你的CSS文件中的条目，如风格类名，你可以这样做：

$("select#style_select").change(function(){ 
    $("div#style_container").removeClass("styleA styleB"); 
    $("div#style_container").addClass($(this).val()); 
});

所以你只需要改变对div容器和整个页面应该根据自己的CSS规则更新类。

来源

2011-08-04 16:47:18 Olives

你已经给了2个解决方案：

形式单一，选择样式选项时，涉及到具体的风格孩子的选项将显示出来，做到这一点最简单的方法是有一个JavaScript函数（让我们称之为switch_size_display），当样式选择被改变时，显示或隐藏可用的选项。
多页形式，这对您的访问者来说更加困难和不太可取，可以使用cookies，Get或Post完成：在第1页上，用户将选择将保存在变量上的“样式”（cookie/get/post）中，用户将会看到与变量上的样式相关的“大小”。

它你正在学习Javascript和PHP，这两个解决方案都是很好的练习。最后一件事是，你永远不应该信任用户的输入，如果你正在创建一个可以在线（不是本地）的网站，请确保你严格验证来自URL，Cookies等的任何内容......

来源

2011-08-04 17:11:42

选择$ this，显示$ that - 如何使用表单进行操作？

回答

相关问题