我真的很想有一个使用 JavaScript 的下拉表单。我需要它来创建一个问题。它是如何工作的:此人将从主页单击“创建问题”，然后它将转到“创建问题”页面。在那个页面上，它问这个人的第一个问题是“你想问什么类型的问题？”然后，通过几个单选按钮，他们可以选择他们想要的类型，“多项选择”、“选择最佳”或“简答”。从那时起，会出现更多的表格……换句话说，根据他们想问的问题类型，在向服务器提交他们想问的问题之前，要求他们填写一组不同的标准.这有意义吗？到目前为止，这是我的表格:
<!DOCTYPE html>
<html>
<head>
<title>Quick Bump</title>
<link href="styles.css" type="text/css" rel="stylesheet" />
</head>
<body>
<div class="center">
<h1 class="welcomeHeader">Create a Question:</h1>
<form action="http://www.example.com/profile.php">
<p class="pStyle">Please select what type of Question you'd like to ask:
<br />
<br />
<input type="radio" name="genre" value="Multiple Choice" checked="checked" /> Multiple Choice
<input type="radio" name="genre" value="Select the Best" /> Select the Best
<input type="radio" name="genre" value="Short Answer" /> Short Answer
</p>
<br />
<p class="pStyle">What is your Question?
<br />
<br />
<label>Q:<input type="text" class="resizedTextBox" name="Question" /></label><br />
</p>
<br />
<p class="pStyle">What are the answers available?
<br />
<br />
<label>A:<input type="text" class="resizedTextBox" name="Answer 1" /></label><br />
<label>B:<input type="text" class="resizedTextBox" name="Answer 2" /></label><br />
<label>C:<input type="text" class="resizedTextBox" name="Answer 3" /></label><br />
<label>D:<input type="text" class="resizedTextBox" name="Answer 4" /></label><br />
</p>
<br />
<p class="pStyle">Would you like to submit this question now?</p>
<input type="submit" class="submitLink" name="submit form" value="Submit" />
</form>
</div>
<br />
<div class="footer">
<a href="firstWebPage.html" class="links">Home</a>
</div>
</body>
最佳答案
您可以使用 jQuery 在更改前一个表单元素时逐步显示每个连续的段落。
下面是一个希望能帮助您入门的示例: http://jsfiddle.net/kevincollins/uarZb/
$(function () {
$('.pStyle:first').show();
$('input[name="genre"]').change(function(){
$('.pStyle:eq(1)').show();
});
$('input[name="Question"]').change(function(){
$('.pStyle:eq(2)').show();
});
$('input[name^="Answer"]').change(function(){
$('.pStyle:eq(3)').show();
});
});
关于javascript - 使用 JavaScript 的动态下拉表单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15823623/