1

我使用基于下拉列表的 jquery 填充表单我有一个下拉列表来处理人数和步行者人数我根据没有选择的人在 div 中生成我的 html 但我有这么多字段并且我已经将它们放在变量中但是当我在 html 中使用空格它显示一个错误所以有什么替代方法我应该如何使用 for 循环中的变量生成我的 html

<script src="http://code.jquery.com/jquery-1.9.1.js"></script></script>
<script>
$(document).ready(function () {
    $("#num-people").change(function () {
        var countP = parseInt($("select#num-people option:selected").val());

        $("#walker option").each(function (index) {
            if (countP < index) {
                var newindex = index

                $("#walker option[value=" + newindex + "]").remove();
            }

        })
        for (var i = 1; i <= countP; i++) {
            $("#walker option[value=" + i + "]").remove();
            var j = i + 1;

            $('#walker').append(new Option('walker' + i, i));
            var walk = "#walker";
            var formhtml =
                "<div id=walker" + i + " style='display:none'>First Name:<input type='text' name='wname" + i + "' id='wname" + i + "'>Last Name:<input type='text' name='lname' id='lname'></div>";

            //generate waler if not exist
            if ($(walk + i).length == 0) {

                $('#form_div').append(formhtml);
            }
            //display walker                            
            $("#walker").change(function () {
                var numwalker = parseInt($("select#walker option:selected").val());

                $('#walker' + numwalker).css('display', 'block');
            })
        }
    })
});
</script>

<select name="num-people" id="num-people">
<option name="1">1</option>
<option name="2">2</option>
<option name="3">3</option>
<option name="4">4</option>
<option name="5">5</option>
<option name="6">6</option>
</select>

<select name="walker" id="walker">
<option value="">Select Walker</option>
</select>


<div id="form_div">

</div>

当我在变量中使用带有空格的 html 时，它会显示一个错误，并且我有很多字段要管理，那么如何动态地在 div id 等中保持变量值。（使用 php 代码或使用 jquery，但生成 html 的方式不同）

var formhtml=
"<div id=walker"+i+" style='display:none'>
First Name:<input type='text' name='wname"+i+"' id='wname"+i+"'>
Last Name:<input type='text' name='lname' id='lname'>
</div>";
4

1 回答 1

0

您可以使用 关闭每一行" +，然后再次打开每一行"

var formhtml=
"<div id=walker"+i+" style='display:none'> " +
"First Name:<input type='text' name='wname"+i+"' id='wname"+i+"'> " +
"Last Name:<input type='text' name='lname' id='lname'> " +
"</div>";

或者你可以逃避换行符\

var formhtml=
"<div id=walker"+i+" style='display:none'> \
First Name:<input type='text' name='wname"+i+"' id='wname"+i+"'> \
Last Name:<input type='text' name='lname' id='lname'> \
</div>";
于 2013-07-06T14:04:25.350 回答