Question

当我有一个添加一些Web元素的底部函数时，我对此有疑问：

 var index = 0;
    $("#addGift").click(function () {
        var gift = "<ul id=\"ul\">\n" +
            "        <li>\n" +
            "            <label>Gift Type1</label>\n" +
            "            <select name=\"giftType\">\n" +
            "                <option value=\"coin\">coin</option>\n" +
            "                <option value=\"album\">album</option>\n" +
            "                <option value=\"vip\">vip</option>\n" +
            "            </select>\n" +
            "        </li>\n" +
            "        <li>\n" +
            "            <label>Num</label>\n" +
            "            <input type=\"number\" name=\"num\">\n" +
            "        </li>\n" +
            "        <li>\n" +
            "            <label>Time</label>\n" +
            "            <input name=\"time\" class=\"easyui-datebox\" data- 
     options=\"sharedCalendar:'#cc'\">\n" +
            "        </li>\n" +
            "        <li>\n" +
            "            <label>Unit</label>\n" +
            "            <select name=\"unit\">\n" +
            "                <option value=\"day\">day</option>\n" +
            "                <option value=\"month\">month</option>\n" +
            "            </select>\n" +
            "        </li>\n" +
            "        <li>\n" +
            "            <label>Gift Type2</label>\n" +
            "            <select name=\"giftType\">\n" +
            "                <option value=\"coin\">coin</option>\n" +
            "                <option value=\"album\">album</option>\n" +
            "                <option value=\"vip\">vip</option>\n" +
            "            </select>\n" +
            "        </li>\n" +
            "        <li>\n" +
            "            <label>Num</label>\n" +
            "            <input type=\"number\" name=\"num\">\n" +
            "        </li>\n" +
            "        <li>\n" +
            "            <label>Time</label>\n" +
            "            <input name=\"time\" class=\"easyui-datebox\" data- 
    options=\"sharedCalendar:'#cc'\">\n" +
            "        </li>\n" +
            "        <li>\n" +
            "            <label>Unit</label>\n" +
            "            <select name=\"unit\">\n" +
            "                <option value=\"day\">day</option>\n" +
            "                <option value=\"month\">month</option>\n" +
            "            </select>\n" +
            "        </li>\n" +
            "    </ul>"
        $("#giftTable").append(gift);
        index++;
    });

我尝试了多种方法来获取name='time'或name='unit'之类的网络元素来显示或隐藏动作，但这是行不通的。因为我没有正确地获得这些元素。

那么如何在Jquery附加功能中获得特殊的Web元素？

Answer 1

欢迎堆栈溢出。

ECMAScript 6（ES6）引入了一种新型的文字，即 template literals 。它们具有许多功能，其中包括变量插值，但最重要的是，对于这个问题，它们可以是多行的。

模板文字由反引号定界：

var index = 0;
$("#addGift").click(function () {
    var gift = `<ul id="ul">
                  <li>
                    <label>Gift Type1</label>
                    <select name="giftType">
                        <option value="coin">coin</option>
                        <option value="album">album</option>
                        <option value="vip">vip</option>
                    </select>
                  </li>
                  <li>
                    <label>Num</label>
                    <input type="number" name="num">
                  </li>
                  <li>
                    <label>Time</label>
                    <input name="time" class="easyui-datebox" data-options="sharedCalendar:'#cc'">
                  </li>
                  <li>
                    <label>Unit</label>
                    <select name="unit">
                        <option value="day">day</option>
                        <option value="month">month</option>
                    </select>
                  </li>
                  <li>
                    <label>Gift Type2</label>
                    <select name="giftType">
                        <option value="coin">coin</option>
                        <option value="album">album</option>
                        <option value="vip">vip</option>
                    </select>
                  </li>
                  <li>
                    <label>Num</label>
                    <input type="number" name="num">
                  </li>
                  <li>
                    <label>Time</label>
                    <input name="time" class="easyui-datebox" data-options="sharedCalendar:'#cc'">
                  </li>
                  <li>
                    <label>Unit</label>
                    <select name="unit">
                        <option value="day">day</option>
                        <option value="month">month</option>
                    </select>
                   </li>
                </ul>`;

    $("#giftTable").append(gift);
    index++;
});

如何在Jquery附加功能中获取特殊的Web元素？

1 个答案: