Question

   <a href="" >add Select box</a>

我想要的是当我点击锚标签时我应该打开一个选择框...每次新点击都会出现一个新的选择框...假设我先点击锚标签我应该显示一个选择框...当我再次点击它它应该再次打开一个选择框...但我想在jquery中...所以任何人都可以帮我这个？

        <script type="text/javascript">

        ???

 </script>

Answer 1

试试这个jQuery代码：

$('#link').click(function(){
    $('body').append($('<select></select>'));
});

更新：Fiddle

Answer 2

这个怎么样

http://jsfiddle.net/wWhZL/

var arr = [{
    val: 1,
    text: 'Option 1'
}, {
    val: 2,
    text: 'Option 2'
}];

$(function () {
    $('a').click(function () {
        var sel = $('<select>').appendTo('body');
        $(arr).each(function () {
            sel.append($("<option>").attr('value', this.val).text(this.text));
        });
        return false;
    });
});

Answer 3

Check with below Code:

     $('#add').click(function (e) {
                    e.preventDefault();
                    var $select = $('<select></select>');
                    $select.append($("<option></option>").attr("value", "0").text("--- Select ---"));
                    $(this).append($select);
                });

    <a href="javascript:void(0);" id="add" >add Select box</a>

FIDDLE http://jsfiddle.net/sethuramanP/8k75T/

Answer 4

我有一个演示请查看链接

http://jsfiddle.net/ph5Ya/1/

<强> HTML

<a href="#" id="openSelectBox">add Select box</a> | <a href="#" id="closeSelectBox">Close Select box</a>

<br>
<select name="country_id" id="country_id" tabindex="1">
    <optgroup label="North America">
        <option value="1">USA</option>
        <option value="9">Canada</option>
    </optgroup>
    <optgroup label="Europe">
        <option value="2">France</option>
        <option value="3">Spain</option>
        <option value="6">Bulgaria</option>
        <option value="7" disabled="disabled">Greece</option>
        <option value="8">Italy</option>
    </optgroup>
    <optgroup label="Asia" disabled="disabled">
        <option value="5">Japan</option>
        <option value="11">China</option>
    </optgroup>
    <option value="4">Brazil</option>
    <option value="10">South Africa</option>
</select>

<强>脚本

$(function () {
    $("#country_id").selectbox();
    $("#openSelectBox").click(function () {
        $("#country_id").selectbox("open");
    });

    $("#closeSelectBox").click(function () {
        $("#country_id").selectbox("close");
    });

});

在jquery中每次单击锚标记时打开一个选择框

4 个答案: