程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> C# >> C#入門知識 >> 淺談JQuery中的一些知識點

淺談JQuery中的一些知識點

編輯:C#入門知識

1、用JQuery檢查網頁上是否有某個對象的方法:

如何判斷對象是否存在,,調用text()、html()、click()之類方法的時候其實是對數組中每個DOM對象迭代調用每個方法,因此即使通過id選擇的元素不存在也不會報錯,如果需要判斷指定的id是否存在,應該寫:

 

//通過判斷$("#btn1")這個集合中對象的個數來判斷是否有對象存在(可行)

if ($("#btn1").length <= 0) {

    do something

}

 

//直接判斷是否有DOM對象存在(可行)

if ($("#btn1")[0]) {

    do something

}

 

//

if($("#btn1")){

do something

}

 

 

<html xmlns="http://www.w3.org/1999/xhtml">

 

<head>

 

    <title></title>

 

    <script src="../Scripts/jquery-1.4.1.js" type="text/javascript"></script>

 

    <script type="text/javascript">

 

        $(function () {

 

            $('#allOrNone').click(function () {

 

                //點擊“選擇狀態”,實現全選與全不選

 

                $(':checkbox').attr('checked', $(this).attr('checked'));

 

            });

 

 

 

            //當改變了上面選擇項的選中狀態後,“選擇狀態”的狀態也跟著改變

 

            $(':checkbox[id!=allOrNone]').click(function () {

 

                optionStateChanged();

 

              

 

            });

 

 

 

 

 

            //選項改變抽象的方法

 

            function optionStateChanged() {

 

                var state = true;

 

                $(':checkbox[id!=allOrNone]').each(function () {

 

                    if (!$(this).attr('checked')) {

 

                        state = false;

 

                        return false;

 

                        //break;   不可以使用break;

 

                    }

 

                });

 

                //如果有一個沒有被選中,則將“選擇狀態”的狀態也設置為沒有選中狀態

 

                $('#allOrNone').attr('checked', state);

 

            }

 

 

 

            //反選

 

            $('#chooseReverse').click(function () {

 

               //進行選項的反選工作

 

                $(':checkbox[id!=allOrNone]').each(function () {

 

                    $(this).attr('checked', !$(this).attr('checked'));

 

                });

 

               //單獨考慮選項改變的操作

 

                optionStateChanged();

 

            });

 

        });

 

    </script>

 

</head>

 

<body>

 

    <input type="checkbox" value="1" />足球

 

    <input type="checkbox" value="2" />足球

 

    <input type="checkbox" value="3" />足球

 

    <input type="checkbox" value="4" />足球

 

    <input type="checkbox" value="5" />足球<br />

 

    <input type="checkbox" name="name" value="" id="allOrNone"/>選擇狀態

 

    <input type="button" name="name" value="反選" id="chooseReverse"/>

 

</body>

 

</html>

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved