jquery教程,jquery教程w3school

如何在单独的js文件里调用jquery

需要准备的材料分别有:电脑、html编辑器、浏览器。

10年积累的做网站、网站建设经验,可以快速应对客户对网站的新想法和需求。提供各种问题对应的解决方案。让选择我们的客户得到更好、更有力的网络服务。我虽然不认识你,你也不认识我。但先网站制作后付款的网站建设流程,更有平鲁免费网站建设让你可以放心的选择与我们合作。

1、首先,打开html编辑器,新建html文件,例如:index.html,先引入jquery。

2、在index.html中的/body标签前,引入自己写的js文件,例如index.js文件。

3、在index.js中调用jquery的函数。

4、浏览器运行index.html页面,此时成功调用了index.js中编写的内容。

jquery 多个 上传文件教程

jquery 实现多个上传文件教程:

首先创建解决方案,添加jquery的js和一些资源文件(如图片和进度条显示等):

jquery-1.3.2.min.js

jquery.uploadify.v2.1.0.js

jquery.uploadify.v2.1.0.min.js

swfobject.js

uploadify.css

1、页面的基本代码如下

这里用的是aspx页面(html也是也可的)

页面中引入的js和js函数如下:

script src="js/jquery-1.3.2.min.js" type="text/javascript"/script  

script src="js/jquery.uploadify.v2.1.0.js" type="text/javascript"/script  

script src="js/jquery.uploadify.v2.1.0.min.js" type="text/javascript"/script  

script src="js/swfobject.js" type="text/javascript"/script  

link href="css/uploadify.css" rel="stylesheet" type="text/css" /  

/script

js函数:

script type="text/javascript"  

$(document).ready(function () {  

$("#uploadify").uploadify({  

'uploader': 'image/uploadify.swf',  //uploadify.swf文件的相对路径,该swf文件是一个带有文字BROWSE的按钮,点击后淡出打开文件对话框                

'script': 'Handler1.ashx',//    script :  后台处理程序的相对路径  

'cancelImg': 'image/cancel.png',  

'buttenText': '请选择文件',//浏览按钮的文本,默认值:BROWSE。  

'sizeLimit':999999999,//文件大小显示  

'floder': 'Uploader',//上传文件存放的目录  

'queueID': 'fileQueue',//文件队列的ID,该ID与存放文件队列的div的ID一致  

'queueSizeLimit': 120,//上传文件个数限制  

'progressData': 'speed',//上传速度显示  

'auto': false,//是否自动上传  

'multi': true,//是否多文件上传  

//'onSelect': function (e, queueId, fileObj) {  

//    alert("唯一标识:" + queueId + "\r\n" +  

//  "文件名:" + fileObj.name + "\r\n" +  

//  "文件大小:" + fileObj.size + "\r\n" +  

//  "创建时间:" + fileObj.creationDate + "\r\n" +  

//  "最后修改时间:" + fileObj.modificationDate + "\r\n" +  

//  "文件类型:" + fileObj.type);  

//    }  

'onQueueComplete': function (queueData) {  

alert("文件上传成功!");                    

return;  

}  

});  

});

页面中的控件代码:

body  

form id="form1" runat="server"  

div id="fileQueue"         

/div  

div  

p  

input type="file" name="uploadify" id="uploadify"/  

input id="Button1" type="button" value="上传" onclick="javascript: $('#uploadify').uploadifyUpload()" /  

input id="Button2" type="button" value="取消" onclick="javascript:$('#uploadify').uploadifyClearQueue()" /  

/p  

/div  

/form  

/body

函数主要参数:

$(document).ready(function() {  

$('#fileInput1').fileUpload({  

'uploader': 'uploader.swf',//不多讲了  

'script': '/AjaxByJQuery/file.do',//处理Action  

'cancelImg': 'cancel.png',          

'folder': '',//服务端默认保存路径  

'scriptData':{'methed':'uploadFile','arg1','value1'},  

//向后台传递参数,methed,arg1为参数名,uploadFile,value1为对应的参数值,服务端通过request["arg1"]  

'buttonText':'UpLoadFile',//按钮显示文字,不支持中文,解决方案见下  

//'buttonImg':'图片路径',//通过设置背景图片解决中文问题,就是把背景图做成按钮的样子  

'multi':'true',//多文件上传开关  

'fileExt':'*.xls;*.csv',//文件过滤器  

'fileDesc':'.xls',//文件过滤器 详解见文档  

'onComplete' : function(event,queueID,file,serverData,data){   

//serverData为服务器端返回的字符串值  

alert(serverData);  

}  

});  

});

后台一般处理文件:

using System;  

using System.Collections.Generic;  

using System.Linq;  

using System.IO;  

using System.Net;  

using System.Web;  

using System.Web.Services;  

namespace fupload  

{  

/// summary  

/// Handler1 的摘要说明  

/// /summary  

public class Handler1 : IHttpHandler  

{  

public void ProcessRequest(HttpContext context)  

{  

context.Response.ContentType = "text/plain";  

HttpPostedFile file = context.Request.Files["Filedata"];//对客户端文件的访问  

string uploadPath = HttpContext.Current.Server.MapPath(@context.Request["folder"])+"\\";//服务器端文件保存路径  

if (file != null)  

{  

if (!Directory.Exists(uploadPath))  

{  

Directory.CreateDirectory(uploadPath);//创建服务端文件夹  

}  

file.SaveAs(uploadPath + file.FileName);//保存文件  

context.Response.Write("上传成功");  

}  

else  

{  

context.Response.Write("0");  

}  

}  

public bool IsReusable  

{  

get  

{  

return false;  

}  

}  

}  

}

以上方式基本可以实现多文件的上传,大文件大小是在控制在10M以下/。

如何在 Wordpress 中使用 jQuery

如何在 WordPress 中使用 jQuery?

1.首先要加载 jQuery 库

这步很简单,你只需要在你使用的 WordPress 主题的 header.php 文件的 head 标签中加入如下代码即可:

script type="text/javascript" src=""/script

你也可以把 google 上的 jQuery 库下载到本地再加载,不过并不推荐你这么做,用 google 的就可以的。

2.在主题中调用 .js 文件

新建立一个 .js 文件,在文件中加入如下代码:

jQuery(document).ready(function($){

// 这里就是你需要添加的教程中提到的一些 jQuery 代码

});

例如返回顶部标签里面的JS文件是这样写的:

jQuery(document).ready(function($){

$('#shang').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);});

$('#xia').click(function(){$('html,body').animate({scrollTop:$('#footer').offset().top}, 800);}); 

});

最后在主题中调用这个 .js 文件,假设你建立的文件名为 all.js,那么直接在主题文件 header.php 中的 head 区域添加如下样式代码即可:

script type="text/javascript" src=""/script

3.你在期待第三步吗?没了哈,通过两步操作已经完成了,哈哈。

通过以上的操作你已经可以在 WordPress 中使用 jQuery 了,以后再看到类似的教程,都按这个操作来就行了,通过自己的操作你就会发现,原来,传说中的改代码也不是那么的难。


网站名称:jquery教程,jquery教程w3school
当前URL:http://scjbc.cn/article/dsddsgo.html

其他资讯