常见的JQuery操作汇总

最新推荐文章于 2024-07-14 19:15:47 发布

webdoes

最新推荐文章于 2024-07-14 19:15:47 发布

阅读量751

点赞数

分类专栏： JavaScript 文章标签： jquery class function xml microsoft url

本文链接：https://blog.csdn.net/jallin2001/article/details/5702375

版权

JavaScript 专栏收录该内容

32 篇文章 0 订阅

订阅专栏

上个月主要从事了大机构项目的开发，总体上讲，有不少收获。一些比较常用的代码现在记录下来，供以后的学习的总结。

主要是对XML的一些基本操作。

另外一个是对页面的操作，无提示的关闭页面。

//无提示的关闭页面
function Close() { var ua = navigator.userAgent; var ie = navigator.appName == "Microsoft Internet Explorer" ? true : false; if(ie) { var IEversion = parseFloat(ua.substring(ua.indexOf("MSIE ") + 5, ua.indexOf(";", ua.indexOf("MSIE ")))); if(IEversion < 5.5) { var str = '<object id=noTipClose classid="clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11">' str += '<param name="Command" value="Close"></object>'; document.body.insertAdjacentHTML("beforeEnd", str); document.all.noTipClose.Click(); } else { window.opener = null; window.close(); } } }

在JQuery中，非常方便的类似CSS选择器的方式，对于查找元素，对元素进行操作，非常方便。

//鼠标移入和离开dd时的效果 $("dd").hover( function(){ $(this).addClass("mouse_over"); }, function(){ $(this).removeClass("mouse_over"); } ); /** * 用户在点击"个股涨幅"等标签时调用下面的方法 * (1) 得到用户选择的id和class值，然后判断是否已经选择。 * (2) 如果选择了该条件，则取消该选择。同时右侧的图标和方案最后面的图标都变暗。 * (3) 如果没有选择该条件，这选择，同时默认的方案值从xml值读取后，对应的方案和后面的图标都变亮 */ $("dd").bind('click',function(){ //需要判断是否已经选中。 //alert("a"); var ifChoosed = $(this).children("span:eq(1)").attr("class"); //是否"个股涨幅"等标签被选中 var id = $(this).attr("id").slice(0,-1); var selected = $(userXML).find(id).attr("s"); //alert(selected); //查找该xml文件中，用户选择的是哪一个方案 if ("but_chooer_out" == ifChoosed){ //表示没有选中，单击需要选中 $(this).children("span:eq(1)").attr("class","but_chooer_over"); //个股涨幅 $("#"+selected).children("span:eq(1)").attr("class","but_radio_over"); //找到方案1 $("#"+selected).children("span:eq(0)").attr("class","but_setting_over");//找到 //$("#"+id).attr("class","but_show_over"); } else { //表示已经选中，单击需要取消选中 $(this).children("span:eq(1)").attr("class","but_chooer_out"); //alert(id); //alert ($(this).attr("id")); if ("none" != id) { //如果该id为none的时候，表明没有子元素了 $("."+id).find("span:eq(1)").attr("class","but_radio_out"); //$("#"+id).attr("class","but_show_out"); $("."+id).find("span:eq(0)").attr("class","but_setting_out"); //把所有方案后面的灯熄灭 } } }); /** * 鼠标两次单击每个选项后面的图书状按钮时 nth-child(1)与eq(0)是不一样的。前者是一类，后者是单独一个。 * (1)如果灯是暗的，单击变亮。但是如果其父元素的dd没有子元素，则应该是无法变亮 * (2)如果灯是亮的，单击变暗。 */ $(".title:lt(4)").next().find("dd span:nth-child(1)").click(function(event){ var id = $(this).attr("id"); //alert(id); //alert($(this).attr("class")); var id1 = id+"1"; var id2 = id+"2"; var id3 = id+"3"; var id4 = id+"4"; if ("but_show_out" == $(this).attr("class")){ //表明灯是暗的 if ("" == id) { //用户点击的是：多头排列等6大无子元素的选项 //var pid = $(this).parent().attr("id").slice(0,-1); //$(this).next().attr("class","but_chooer_over"); $(this).next().toggleClass("but_chooer_over"); } else{ $("dd span:first-child").attr("class","but_show_out"); $(this).attr("class","but_show_over"); //alert($(this).attr("id")); $("dt").hide(); $("#"+id1).show(); $("#"+id2).show(); $("#"+id3).show(); $("#"+id4).show(); } } else { //表明灯是亮的 $(this).attr("class","but_show_out"); $("#"+id1).hide(); $("#"+id2).hide(); $("#"+id3).hide(); $("#"+id4).hide(); } event.stopPropagation(); //这里阻止了事件冒泡，防止进一步扩散到dd的单击事件 }); /** * 用户点击行情角度的方案1,2,3之类的按钮时：执行下面的回调函数， * (1)把相应的值传递给内嵌的页面 */ $(".but_radio_out").bind('click',function(){ var thisClass = $(this).parent().attr("class"); //得到的是<dt id="ggzf1" class="ggzf">这样的元素的class值 $("."+thisClass).find("span:nth-child(1)").attr("class","but_setting_out");//让该选项下的每个方案最后的图案变暗 $(this).prev().attr("class","but_setting_over"); //让每个方案最后的图案变亮 $("."+thisClass).find("span:nth-child(2)").attr("class","but_radio_out");//得到的是方案1的元素 $(this).attr("class","but_radio_over"); //修改选定的方案的样式 $("#"+thisClass+"_").children("span:eq(1)").attr("class","but_chooer_over"); var id = $(this).parent().attr("id"); //点击的某个项目的方案1,2,3对应的父元素<dt>的id号 //alert("id="+id+"thisClass="+thisClass); //id=ggzf1 thisClass=ggzf var toSendUser = ""; //用户设置的值 var toSendDefault = ""; //默认设置的值 toSendPath = mainPath + thisClass + "//" + id + ".html"; //发送html对应的全路径 alert(toSendPath); /** * 由于默认值我们已经明确了。可以在第一次传入给控件时，直接生成。在用户填写完成后，点击保存，我们再把值传回。 * 本来打算通过json进行传递，不过考虑到json解析起来麻烦，于是还是采用xml的string格式进行传递。 * 只有7个选项需要进行解析 */ if (thisClass == "ggzf" || thisClass == "ggzj" || thisClass == "gghs") { //个股涨幅,个股资金,个股换手:-2,2_-2,4_-2,8_-2,16_ $(userXML).find(id).children().each(function(){ //alert($(this).attr("v")); //alert($(this).children().text()); toSendUser += $(this).attr("s") + "," + $(this).attr("v") + "_"; //;会在url进行解析的时候删除 }); $(defaultXML).find(id).children().each(function(){ toSendDefault += $(this).attr("s") + "," + $(this).attr("v") + "_"; //;会在url进行解析的时候删除 }); var param = {"user" : toSendUser, "default" : toSendDefault, "url" : toSendPath}; var s = thsLdr.setSolution(param); //该处的s是用户填写完后回传的字符串 if (s != "") { //用户点击的是保存按钮，把传回来的字符串写入到xml文件中。同时记录用户默认选择的是哪一个方案 alert("s=" + s); //s=2,0.20_2,0.40_2,0.8_2,1.6 var resArray = s.split("_"); $(userXML).find(id).children().each(function(i){ $(this).attr("s",resArray[i].split(",")[0]); $(this).attr("v",resArray[i].split(",")[1]); }); } //用户点击的是关闭按钮，同样需要记录用户选择的是哪一个方案，写入到xml配置文件 } else if (thisClass == "ggjx") { //个股均线:1;1;1;1; $(userXML).find(id).children().each(function(){ toSendUser += $(this).attr("s") + "_"; }); var param = {"user" : toSendUser, "default" : toSendDefault, "url" : toSendPath}; var s = thsLdr.setSolution(param); //该处的s是用户填写完后回传的字符串 if (s != ""){ //用户点击的是保存按钮，把传回来的字符串写入到xml文件中。同时记录用户默认选择的是哪一个方案 alert("s=" + s); var resArray = s.split("_"); $(userXML).find(id).children().each(function(i){ $(this).attr("s",resArray[i]); }); } } else if (thisClass == "zfrd" || thisClass == "zjrd" || thisClass == "hsrd") { //涨幅热点,资金热点,换手热点:10,3,3; toSendUser = $(userXML).find(id).children().attr("s") + "," + $(userXML).find(id).children().attr("b") + "," + $(userXML).find(id).children().attr("g") var param = {"user" : toSendUser, "default" : toSendDefault, "url" : toSendPath}; var s = thsLdr.setSolution(param); //该处的s是用户填写完后回传的字符串 if (s != ""){ //用户点击的是保存按钮，把传回来的字符串写入到xml文件中。同时记录用户默认选择的是哪一个方案 alert("s=" + s); var resArray = s.split(","); $(userXML).find(id).children().attr("s",resArray[0]); $(userXML).find(id).children().attr("b",resArray[1]); $(userXML).find(id).children().attr("g",resArray[2]); } } $(userXML).find(thisClass).attr("s",id); //alert($(userXML).xml()); writeXML(userPath+"topwin.xml",$(userXML).xml()); //把用户最后的xml文件写入到xml文件中 }); /** * 用户点击 ”表现模型“ 下面的选项按钮时调用下面的方法 */ $(".but_radio_out2").bind('click',function(){ var thisClass = $(this).parent().attr("class"); //得到的是<dt id="xbhy1" class="xbhy">这样的元素的class值 $("dt span:nth-child(2)").attr("class","but_radio_out"); $(this).attr("class","but_radio_over"); $("#"+thisClass+"_").children("span:eq(1)").attr("class","but_chooer_over"); //勾选某个快速选股方案 $(userXML).find($(this).parent().attr("class")).attr("s",$(this).parent().attr("id")); //修改xml文件中对应的属性值 }); /** * 用户点击 ”执行选股" 下面的按钮时调用的方法： * (1)找到所有用户选择的方案，然后组成一个选股公式 * (2)对于快速选股，直接调用saveResult接口 */ $(".but_yes").bind("click",function(){ $(this).attr("class","but_no"); var formula = ""; //选股公式 var ksxg = []; //快速选股数组 var bkxg = []; //板块选股数组 var nums = 0; //板块选择的数量 $(".but_radio_over").each(function(i){ //这里获取用户选择的每个方案或者快速选股的选项 //alert($(this).parent().attr("id")); //这里就可以得到用户选择的具体的方案名称，从而获得对应xml文件 var id = $(this).parent().attr("id"); //选项的id var cs = $(this).parent().attr("class"); //选项的class if (cs == "ggzf" || cs == "ggzj" || cs == "gghs") { //个股涨幅,个股资金，个股换手 var symbol1 = $(userXML).find(id).children("a").attr("s").symbolTrans(); //1日涨幅的符号 var symbol3 = $(userXML).find(id).children("b").attr("s").symbolTrans(); //3日涨幅的符号 var symbol5 = $(userXML).find(id).children("c").attr("s").symbolTrans(); //5日涨幅的符号 var symbol10 = $(userXML).find(id).children("d").attr("s").symbolTrans(); //10日涨幅的符号 var value1 = $(userXML).find(id).children("a").attr("v"); //1日涨幅的值 var value3 = $(userXML).find(id).children("b").attr("v"); //1日涨幅的值 var value5 = $(userXML).find(id).children("c").attr("v"); //5日涨幅的值 var value10 = $(userXML).find(id).children("d").attr("v"); //10日涨幅的值 if (cs == "ggzf") { formula += "ZHANGDIEFU " + symbol1 + " " + value1 + ";"; formula += "ZF3 " + symbol3 + " " + value3 + ";"; formula += "ZF5 " + symbol5 + " " + value5 + ";"; formula += "ZF10 " + symbol10 + " " + value10 + ";"; } else if (cs == "ggzj") { formula += "大单净量 " + symbol1 + " " + value1 + ";"; formula += "大单净量3日 " + symbol3 + " " + value3 + ";"; formula += "大单净量5日 " + symbol5 + " " + value5 + ";"; formula += "大单净量10日 " + symbol10 + " " + value10 + ";"; } else if (cs == "gghs") { formula += "HUANSHOU " + symbol1 + " " + value1 + ";"; formula += "HS3 " + symbol3 + " " + value3 + ";"; formula += "HS5 " + symbol5 + " " + value5 + ";"; formula += "HS10 " + symbol10 + " " + value10 + ";"; } } else if (cs == "ggjx") { //个股均线 var symbol5 = $(userXML).find(id).children("a").attr("s").symbolTrans(); //> < var symbol10 = $(userXML).find(id).children("b").attr("s").symbolTrans(); var symbol30 = $(userXML).find(id).children("c").attr("s").symbolTrans(); var symbol60 = $(userXML).find(id).children("c").attr("s").symbolTrans(); formula += "A:MA(CLOSE, 5) ; A" + symbol5 + "A[1];"; formula += "A:MA(CLOSE, 10); A" + symbol10 + "A[1];"; formula += "A:MA(CLOSE, 30); A" + symbol30 + "A[1];"; formula += "A:MA(CLOSE, 60); A" + symbol60 + "A[1];"; } else if (cs == "xbhy" || cs == "wxhy" || cs == "bkrd" || cs == "ddql" || cs == "zfql" || cs == "dfql" || cs == "hsql" || cs == "zlld") { ksxg.push($(this).val()); } else if (cs == "zfrd") { var s = $(userXML).find(id).children().attr("s"); var blockcount = $(userXML).find(id).children().attr("b"); var stockcount = $(userXML).find(id).children().attr("g"); bkxg.push({"method":"quote","datetime":"16380(0-0)", "sortby":"ZF"+sortby,"sorttype":"sort","datatype":"ZF"+sortby, "codelist":"24()","blockcount":blockcount,"stockcount":stockcount}); nums++; } else if (cs == "zjrd") { var sortby = $(userXML).find(id).children().attr("s"); var blockcount = $(userXML).find(id).children().attr("b"); var stockcount = $(userXML).find(id).children().attr("g"); bkxg.push({"method":"quote","datetime":"16380(0-0)", "sortby":"大单净量"+sortby,"sorttype":"sort","datatype":"大单净量"+sortby, "codelist":"24()","blockcount":blockcount,"stockcount":stockcount}); nums++; } else if (cs == "hsrd") { var sortby = $(userXML).find(id).children().attr("s"); var blockcount = $(userXML).find(id).children().attr("b"); var stockcount = $(userXML).find(id).children().attr("g"); bkxg.push({"method":"quote","datetime":"16380(0-0)", "sortby":"HS"+sortby,"sorttype":"sort","datatype":"HS"+sortby, "codelist":"24()","blockcount":blockcount,"stockcount":stockcount}); nums++; } }); /** * 下面的一段代码用来处理“多头排列”..."中线跌破"6大快速选股条件 */ //alert("sele="+$(".list:eq(2)").children("dd").slice(3,9).children("span:nth-child(2)").text()); $(".list:eq(2)").children("dd").slice(3,9).children("span:nth-child(2)").each(function(){ if ($(this).attr("class") == "but_chooer_over") { //只要用户选择了该项目 //alert("match="+$(this).val()); ksxg.push($(this).val()); } });

同时，对于javascript对象的操作，使用了很多。

比如定义一个空的Object对象：

var obj = {};

一般对象的方式是一种key1 : value1, key2 : value2的方式。

比如

return {

key1 : value1,

key2 : value2

};

或者obj["key1"] = value1;. obj.key1 = value1的方式进行对象的赋值和操作。