Question

有没有办法让它在右侧，或者建议我如何使输入txt像选择按钮。

演示可扩展列表

/* this is use for the apearance of the input txt to have downbbutton*/
        <style>
            #dropdown{
                -moz-appearance: spinner-downbutton;
                -webkit-appearance: spinner-downbutton;
            }
        </style>

        <script>

        </script>
    </head>
    <body>
        <div id="listContainer">
            <div>
                <input type="text" id="dropdown" >
            </div>
            <div id="orgContainer">
                <ul id="expList">
                    <li>
                        Item A
                        <ul>
                            <li>
                                Item A.1
                                <ul>
                                    <li>
                                        <span>Kalbo na panot.</span>
                                    </li>
                                </ul>
                            </li>
                            <li>
                                Item A.2
                            </li>
                            <li>
                                Item A.3
                                <ul>
                                    <li>
                                        <span>Macho na bading.</span>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                    <li>
                        Item B
                    </li>
                    <li>
                        Item C
                        <ul>
                            <li>
                                Item C.1
                            </li>
                            <li>
                                Item C.2
                                <ul>
                                    <li>
                                        <span>Buntis na Sungke.</span>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
        </div>
    </body>
</html>

这是我的HTML。

这是我的脚本（script.js）

function prepareList() {
    $('#expList').find('li:has(ul)')
    .click( function(event) {
        if (this == event.target) {
            $(this).toggleClass('expanded');
            $(this).children('ul').toggle('medium');
        }
        return false;
    })
    .addClass('collapsed')
    .children('ul').hide();

    //Create the button funtionality
    $('#expandList')
    .unbind('click')
    .click( function() {
        $('.collapsed').addClass('expanded');
        $('.collapsed').children().show('medium');
    })
    $('#collapseList')
    .unbind('click')
    .click( function() {
        $('.collapsed').removeClass('expanded');
        $('.collapsed').children().hide('medium');
    })

};

$(document).ready( function() {
   $("#orgContainer").hide();

    $("#dropdown").click(function(){
        $("#orgContainer").toggle();
        $(this).blur();
    });

    prepareList()
});

感谢您，考虑到我的问题。提前谢谢。

Answer 1

交配，如果你需要数值，为什么不使用

 <input type="number"  >

默认情况下，您会看到选择值的下拉列表

http://www.w3schools.com/html/tryit.asp?filename=tryhtml_input_number

如何制作-moz-appearance：spinner-downbutton位于最右侧

1 个答案: