Question

如何在一个页面上获取两个jquery ui滑块，当我使用id滑块而不是一个div时，只显示第一个滑块

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />

    <link href="css/style.css" rel="stylesheet" />
    <link rel="stylesheet" href="css/jquery-ui.css" />
    <script src="js/jquery-1.9.1.js"></script>
    <script src="js/jquery-ui.js"></script>

    .
            .
            .
            .
            .


            <div id="left_panel">
                <div id="panel_title">
                    Left Panel
                </div>
                <textarea id="txt" >        </textarea>
                <input type="checkbox" name="right_to_left" value="Bike">
                Right to Left
                <br/>
                <div id="font_family">
                    <!--[if !IE]> -->
                    <div class="notIE">
                        <!-- <![endif]-->
                        hello
                        <select>
                            <option>Apples</option>
                            <option selected>Pineapples</option>
                            <option>Chocklate</option>
                            <option>Pancakes</option>
                        </select>
                        <!--[if !IE]> -->
                    </div>
                    <!-- <![endif]-->
                </div>
                <br/>
                 Size:<div class="font_size" class="slider"></div>
            Opacity:<div class="font_opacity" class="slider"></div>
            </div>

            <div id="middle_panel">
                I am in middle

            </div>

        </div>

    </div>
</body>

请建议？html

Answer 1

按类使用，不要与id一起使用，id必须是唯一的

 Size:<div class="font_size slider"></div>
                Opacity:<div class="font_opacity slider"></div>

Answer 2

您可以在一个页面中添加任意数量的内容，并使它们独立工作，您应该使用唯一身份选择器，id是最好的选择器。 Here是一个表达清楚的小提琴。

在文档上获取多个ui滑块

2 个答案: