怎么吧js这段修改为jQuery

Question

window.onload = function () { var s = document.getElementById("pingStar"); m = document.getElementById("dir"); n = s.getElementsByTagName("li"); input = document.getElementById("startP");//保存所选值 input.value = -1; clearAll = function () { for (var i = 0; i < n.length; i++) { n[i].className = ""; } }; for (var i = 0; i < n.length; i++) { n[i].onclick = function () { var q = this.getAttribute("rel"); clearAll(); input.value = q; for (var i = 0; i < q; i++) { n[i].className = "on"; } m.innerHTML = this.getAttribute("title"); }; n[i].onmouseover = function () { var q = this.getAttribute("rel"); clearAll(); for (var i = 0; i < q; i++) { n[i].className = "on"; } m.innerHTML = this.getAttribute("title"); }; n[i].onmouseout = function () { clearAll(); for (var i = 0; i < input.value; i++) { n[i].className = "on"; } if (input.value == -1) { m.innerHTML = "请选择分数"; } else { m.innerHTML = n[input.value - 1].title; //m.innerHTML = input.title; } } } };

Answer 1

$(function(){

                var s = $("#pingStar");

                m = $("#dir");

                n = $(s).find("li");

                input = $("#startP");

                input.val(-1);

                 

                clearAll = function() {

                    for(var i = 0; i < n.length; i++) {

                        n[i].className = "";

                    }

                };

                 

                for(var i = 0; i < n.length; i++) {

                    n[i].onclick = function() {

                        var q = $(this).attr("rel");

                        clearAll();

                        input.val(q);

                        for(var i = 0; i < q; i++) {

                            n[i].className = "on";

                        }

                        m.html($(this).attr("title"));

                    };

                     

                    n[i].onmouseover = function() {

                        var q = $(this).attr("rel");

                        clearAll();

                        for(var i = 0; i < q; i++) {

                            n[i].className = "on";

                        }

                        m.html($(this).attr("title"));

                    };

                     

                    n[i].onmouseout = function() {

                        clearAll();

                        for(var i = 0; i < input.value; i++) {

                            n[i].className = "on";

                        }

                        if(input.val() == -1) {

                            m.html("请选择分数");

                        } else {

                            m.html(n[input.value - 1].title);

                            //m.innerHTML = input.title; 

                        } 

                    }

                }

                 

            })

             

            //如果有什么问题 就把对象用$()框起来

            例如

             input = $("#startP");

                $(input).val(-1);