0

我想根据下拉列表框中的选定选项在表单中显示多个文本框。

例如,如果用户选择 1,则应显示 1 个文本框,如果用户选择 2,则应显示 2 个文本框。我需要用 PHP 来做。

我使用 jQuery 找到了一些答案。我们可以在 PHP 中使用 jQuery 吗?如果是,那么如何?

编辑

@Edwin Alex 这就是我的选择选项的样子。

<h2><u>DEPENDENT DETAILS</u></h2><br />
            <table  border="1" style="border-style:dotted" width="100%" id="dependenttable">
            <tr><td>No of Dependent</td><td><select name="numDep" id="dropdown">
                <option value="">Please Select</option>
                <option value="0">0</option>
                <option value="1">1</option>
                <option value="2">2</option></select></td></tr>

            <tr id="textboxDiv"></tr>

在 <> 这些文件的末尾,我已经编写了您的代码。

4

2 回答 2

2

您可以使用 Jquery 来获得它。试试这个,

HTML:

<tr><td>No of Dependent</td><td><select name="numDep" id="dropdown">
    <option value="">Please Select</option>
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option></select></td>
</tr>

<tr id="textboxDiv"></tr>

查询:

<script type="text/javascript">
$(document).ready(function() {
    $("#dropdown").change(function() {
        var selVal = $(this).val();
        $("#textboxDiv").html('');
        if(selVal > 0) {
            for(var i = 1; i<= selVal; i++) {
                $("#textboxDiv").append('<input type="text" name="textVal[]" value="" />');
            }
        }
    });
});
</script>

Paste this code at the bottom of your page inside tag.

Your select box ID should be dropdown.

You need to have a div with an ID textboxDiv to place your generated textboxes.

于 2013-01-31T09:27:39.133 回答
0

我认为你可以在 JavaScript 的帮助下轻松做到这一点。这是一个例子。试试看,根据你的要求修改

<html>
<head>
<title>Select DIV to show</title>
<script type="text/javascript">
function show(obj) {
no = obj.options[obj.selectedIndex].value;
count = obj.options.length;
for(i=1;i<count;i++)
document.getElementById('myDiv'+i).style.display = 'none';
if(no>0)
document.getElementById('myDiv'+no).style.display = 'block';
}
</script>
</head>
<body>
<form name="myForm">
<select onChange="show(this)">
<option value="0">Select</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</form>
<div id="myDiv1" style="display:none"> <form>
<select>
<option value="0">Select</option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
</form></div>
<div id="myDiv2" style="display:none"><form><input type="text" ><br>
<input type="text"/><br>
<input type="submit"/></form></div>
<div id="myDiv3" style="display:none"><form><input type="text" ><br>
<input type="text"/><br>
<input type="submit"/></form></div>
</body>
</html>

在此示例中,只需更改“myDiv1”、“myDiv2”、“myDiv3”中的代码。我想它会帮助你的。:)

于 2013-01-31T09:25:05.897 回答