jQuery function的正确书写方法

jQuery 正确的书写格式：
引入：<script src="/libs/jquery/jquery.js" type="text/javascript"></script>
html写法：


代码如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="modules-js/qiyi.js"></script>
<script>
$(function() {
qiyiPlugin.init($("#zong_qiyi"));
});
</script>
</head>
<div id="zong_qiyi">
//XXXXXXXXXXXXXX
</div>
jQuery写法：
var qiyiPlugin =
{
init: function(parentNode) {
var self = this;
self.parentNode = parentNode;
//刷新局部内容
self.parentNode
.on('refresh',function(event){
self.qiyiList();
});
},
//显示
qiyiList: function(){
var self = this;
//显示内功信息
self.getQiyiList(function(result){
//console.log(result);
if(result.qiyiList){
self.qiyiHtml1();//重新覆盖html，防止重复显示内容
self.displayQiyiList(result.qiyiList);//展示页面内容
}else{
alert("没有获得奇艺数据，请查看接口");
}
});
},
//显示奇艺内容
displayQiyiList: function(qiyiList){
var self = this;
var top = "#zong_qiyi";
$(top).find('#qiyi_control_panel').each(function(){
if ($(this).data('data')) $(this).remove();
});
var line0 = $(top).find("#qiyi_control_panel");
$.each(qiyiList,function(index,item2){
var line1 = $(line0).clone();
$(line1).data('data',item2);//附加属性data与信息
$(line1).attr('id',index+1);
$(line1).find("#name").html(item2.name);
$(line1).find("#level").html(item2.level);
$(line1).find("#maxLevel").html(item2.maxLevel);
$(line1).find("#exp").html(item2.exp+"/"+item2.needExp);
$(line1).find("#desc1").html(item2.desc1);
$(line0).before(line1);
$(line1).show();
$(line1).find("#upgrade")
.on('click',function(event){
var table = $(this).parents('table:first');
var info = $(table).data('data');
self.clickToUpgradeQiyi(info, function(result){
if(!result.success){
alert(result.fail.desc1);
}else{
//alert(result.success.desc1);
growingPlugin.playerTopData();//改变attrs属性
self.parentNode.trigger('refresh');
}
});
});
});
},
//赋html值-
qiyiHtml1: function() {
var string = "<table id='qiyi_control_panel' class='table table-bordered table-hover' style='display:none; width:500;'>";
string += "<tr><td>名称：</td><td id=name>haoren_内功</td></tr>";
string += "<tr><td>当前等级：</td><td id=level></td></tr>";
string += "<tr><td>最大等级：</td><td id=maxLevel></td></tr>";
string += "<tr><td>exp：</td><td id=exp></td></tr>";
string += "<tr><td>描述：</td><td id=desc1></td></tr>";
string += "<tr><td><button id='upgrade' class='btn btn-link'>升级</button></td></tr>";
string += "</table>";
$("#zong_qiyi").html(string);
},
//奇艺升级
clickToUpgradeQiyi: function(info,callback) {
var query = "operation=upgradeQiyi";
query += "&qiyiName=" + info.name;
toolsPlugin.play(query,callback);
},
//获得奇艺列表
getQiyiList: function(callback) {
var query = "operation=getQiyiList";
toolsPlugin.play(query,callback);
},
};

赞 (0)

相关推荐

  • Jquery中"$(document).ready(function(){ })"函数的使用详解

    Jquery是优秀的Javascrīpt框架,$是jquery库的申明,它很不稳定(我就常遇上),换一种稳定的写法jQuery.noConflict(); jQuery(document).ready(function(){}); 使用jQuery的好处是它包装了各种浏览器版本对DOM对象(javascript的DOM对象你应该知道吧,就是它了)的操作. 比如jquery写法:$("div p"); // (1)$("div.container"); // (2)$

  • 浅析jQuery(function(){})与(function(){})(jQuery)之间的区别

    Jquery是优秀的Javascrīpt框架.我们现在来讨论下在 Jquery 中两个页面载入后执行的函数. $(document).ready(function(){  // 在这里写你的代码...});在DOM加载完成时运行的代码 可以简写成 jQuery(function(){ }); (function($) {})(jQuery)什么意思?(function(){ })(jQuery); 其实际上是执行()(para)匿名方法,只不过是传递了jQuery对象. 相当于 function

  • jQuery中isFunction方法的BUG修复

    jQuery 1.4 源码 449 行(core.js 431 行),判断是否为函数的方法如下(思路来源于 Douglas Crockford 的<The Miller Device>): isFunction: function( obj ) {    return toString.call(obj) === "[object Function]";}, 同时 jQuery 的作者也作了部分注释: See test/unit/core.js for details co

  • 简单谈谈jQuery(function(){})与(function(){})(jQuery)

    开发jQuery插件时总结的一些经验分享一下. 一.先看 jQuery(function(){ }); 全写为 jQuery(document).ready(function(){ }); 意义为在DOM加载完毕后执行了ready()方法. 二.再看 (function(){ })(jQuery): 其实际上是执行()(para)匿名方法,只不过是传递了jQuery对象. (function($) {-})(jQuery); 这里实际上是匿名函数,如下: function(arg){-} 这就定

  • jQuery中;function($,undefined) 前面的分号的用处

    ;(function($){$.extend($.fn... 一般在一些 JQuery 函数前面有分号,在前面加分号可以有多种用途: 1.防止多文件集成成一个文件后,高压缩出现语法错误. 2.这是一个匿名函数,一般js库都采用这种自执行的匿名函数来保护内部变量 (function(){})(). 3.因为undefined是window的属性,声明为局部变量之后,在函数中如果再有变量与undefined作比较的话,程序就可以不用搜索undefined到window,可以提高程序性能.

  • 解决jquery submit()提交表单提示：f[s] is not a function

    jquery submit()无法提交表单 报错:f[s] is not a function, js submit()无法提交表单 报错:document.getElementByIdx_x(...).submit is not a function 这2个错让人很无奈啊,语法没有任何错误,怎么能报错呢? 因为以前重来没有遇到过,这次是在改别人的代码,回头看了看代码,我靠原来有个按钮的name="submit",把它删掉就能正常提交表单了. 为什么呢?应该是一个type="

  • (function($){...})(jQuery)的意思

    这里实际上是匿名函数 function(arg){...} 这就定义了一个匿名函数,参数为arg 而调用函数时,是在函数后面写上括号和实参的,由于操作符的优先级,函数本身也需要用括号,即: (function(arg){...})(param) 这就相当于定义了一个参数为arg的匿名函数,并且将param作为参数来调用这个匿名函数 而(function($){...})(jQuery)则是一样的,之所以只在形参使用$,是为了不与其他库冲突,所以实参用jQuery var fn = functio

  • jQuery中(function(){})()执行顺序的理解

    总体来说,顺序是这样的:先计算第一个小括号,发现里面的表达式是一个函数,返会该匿名函数的引用(指针),最后一个括号则是建立匿名函数的实参和并执行. 示例: 计算两个数之和. JavaScript: 复制代码 代码如下: (function sum(a,b){ //此处也可去掉sum,以匿名函数的形式出现 alert(a+b); })(7,8); C: 复制代码 代码如下: int sum(int a,int b){return a+b;} void main(){ int (*pt)(int,i

  • jQuery function的正确书写方法

    jQuery 正确的书写格式: 引入:<script src="/libs/jquery/jquery.js" type="text/javascript"></script> html写法: 复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

  • 在layui.use 中自定义 function 的正确方法

    适用于: obj.click() 行内 onclick javascript:函数名() 示例代码: <html> <head> <link rel="stylesheet" href="layui/css/layui.css" rel="external nofollow" media="all"> </head> <body> <a class="

  • Jquery AJAX 框架的使用方法

    刚开始学了 JQuqery, 众多的 $get(),...等等符号早已把我搞晕了.暂时就放弃了.后来学习 ASP.NET AJAX ,在微软的领导下,逐渐由服务器端转向客户端编程. 激起我客户端编程的兴趣,才想起学习一下了 Jquery.随着WEB2.0及ajax思想在互联网上的快速发展传播,陆续出现了一些优秀的Js框架,其中比较著名的有Prototype.YUI.jQuery.mootools.Bindows以及国内的JSVM框架等,通过将这些JS框架应用到我们的项目中能够使程序员从设计和书写

  • jQuery中ajax的load()方法用法实例

    本文实例讲述了jQuery中ajax的load()方法用法.分享给大家供大家参考.具体分析如下: 此函数jQuery中简单而功能强大的ajax方法. 它可以从服务器加载内容,然后写入匹配元素. 语法结构: 复制代码 代码如下: $(selector).load(URL,data,callback); 参数解析: 1.selector:一个选择器,可以将内容加载到此选择器匹配的元素中. 2.URL:必须,需要加载的一个url地址. 3.data:可选,与请求一同发送的查询字符串键/值对集合. 4.

  • Vue.js列表渲染绑定jQuery插件的正确姿势

    使用v-for绑定列表时,有时候需要绑定如select2之类的jQuery插件. 需要在Vue根据数组内容生成dom元素之后,去找到该dom元素,然后 $().xxx绑定jQuery插件. 之前使用Vue.nextTick方法,在一次dom更新以后执行延迟回调,渲染jQuery插件. 然而这并不是一种很好的方式,有时候难以确定dom元素更新是否是我们需要关注的那个. 在列表中渲染Jquery插件的正确姿势,是使用自定义指令.自定义指令提供了一些钩子函数,可以准确的监听到dom元素与数据的绑定周期

  • jquery操作对象数组元素方法详解

    代码如下: 复制代码 代码如下: <div id="div1">      <span>a</span>      <span>b</span>      <span>c</span>  </div> 1.错误方式:不能用[]方式取jquery对象数组,如下: 复制代码 代码如下: $(function() {      var div_span = $("#div1 span&q

  • jQuery验证插件validate使用方法详解

    jQuery验证插件validate使用方法详解

    1. 写在前面 我们知道,用户在注册的时候,会有个表单页面,然后有些选项是必填的,有些要填的内容是有规范的,这些都要在用户提交之前进行验证才行,如果不符合要求,需要在右边显示一个友好的提示,让用户修改. 记得以前在学习Servlet的时候,实现一个简单的用户注册功能的验证是在后台做的,有些用了正则表达式,有些没用,但是都比较简单.流程是这样的,前台提交表单数据后,servlet获取数据先进行验证,如果不符合要求,将提示信息放到一个List中,然后再把List存到session中,跳转到一个新的页

  • jquery里的each使用方法详解

    each()函数是基本上所有的框架都提供了的一个工具类函数,通过它,你可以遍历对象.数组的属性值并进行处理.jQuery和jQuery对象都实 现了该方法,对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQuery的each方法.换句话 说:jQuery提供的each方法是对参数一提供的对象的中所有的子元素逐一进行方法调用.而jQuery对象提供的each方法则是对jQuery内 部的子元素进行逐个调用. 这个JQUERY里的核心代码 复制代码

  • jQuery ajax的功能实现方法详解

    jQuery的ajax方法非常好用,这么好的东西,你想拥有一个属于自己的ajax么?接下来,我们来自己做一个简单的ajax吧. 实现功能 由于jq中的ajax方法是用了内置的deferred模块,是Promise模式的一种实现,而我们这里没有讲过,所以我们就不使用这一模式啦. 我们只定义一个ajax方法,他可以简单的get,post,jsonp请求就可以啦~~ var ajax = function () { // 做一些初始化,定义一些私有函数等 return function () { //

  • JS/jQuery实现获取时间的方法及常用类完整示例

    JS/jQuery实现获取时间的方法及常用类完整示例

    本文实例讲述了JS jQuery实现获取时间的方法及常用类.分享给大家供大家参考,具体如下: 效果图 源码解析 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>JS获取时间的方法及常用类</title> <style type="text/css"> input{ color:red; min-width: 25

随机推荐