1. 使用js如何調用ASP.NET的後台方法
用jquery的ajax就可以的,實例如下:
<script src="Jquery/jquery-1.4.2-vsdoc.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#btnOK").click(function() {
$.ajax({
//要用post方式
type: "POST",
//方法所在頁面和方法名
url: "AjaxPage.aspx/ABC",
data: "{abc:111}", //帶參數的,參數名稱abc,參數「111」
//date:"{}",//沒有參數的初始化
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(data) {
//返回的數據用data.d獲取內容
alert(data.d);
}
});
});
});
</script>
<body>
<form id="form1" runat="server">
<asp:Button ID="btnOK" runat="server" Text="ShowText" />
</form>
</body>
後台:引入using System.Web.Services;
[WebMethod]
public static string ABC(string abc) //帶參數的方法
{
return abc;
}
webconfig下得有如下配置節:
<httpMoles>
<add name="ScriptMole" type="System.Web.Handlers.ScriptMole, System.Web.Extensions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
</httpMoles>
這個在vs2008里是可行的,版本低的話,可能不能直接這么調用
2. 如何用js將後端取出的數據填進表格裡面
function getMoleInfo() {
$.ajax({
type: "GET",
dataType: "json",
url: "../Handler/TestHandler.ashx?Method=GetMoleInfo",
//data: { id: id, name: name },
success: function(json) {
var typeData = json.Mole;
$.each(typeData, function(i, n) {
var tbBody = ""
var trColor;
if (i % 2 == 0) {
trColor = "even";
}
else {
trColor = "odd";
}
tbBody += "<tr class='" + trColor + "'><td>" + n.MoleNum + "</td>" + "<td>" + n.MoleName + "</td>" + "<td>" + n.MoleDes + "</td></tr>";
$("#myTb").append(tbBody);
});
},
error: function(json) {
alert("載入失敗");
}
});
}
第一:建立Default.aspx頁面
<html>
<head runat="server">
<title>ajax圖片上傳</title>
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/jquery.form.js" type="text/javascript"></script>
<script type="text/javascript">
function upload(){
var path = document.getElementById("File1").value;
var img = document.getElementById("img1");
if($.trim(path)==""){
alert("請選擇要上傳的文件");
return;
}
$("#form1").ajaxSubmit({
success: function (str) {
if(str!=null && str!="undefined"){
if (str == "1") {alert("上傳成功");document.getElementById("img1").src="images/logo.jpg?"+new Date();/*上傳後刷新圖片*/}
else if(str=="2"){alert("只能上傳jpg格式的圖片");}
else if(str=="3"){alert("圖片不能大於1M");}
else if(str=="4"){alert("請選擇要上傳的文件");}
else {alert('操作失敗!');}
}
else alert('操作失敗!');
},
error: function (error) {alert(error);},
url:'Handler.ashx', /*設置post提交到的頁面*/
type: "post", /*設置表單以post方法提交*/
dataType: "text" /*設置返回值類型為文本*/
});
}
</script>
</head>
<body>
<form id="form1" runat="server">
<input id="File1" name="File1" type="file" />
<input id="iptUp" type="button" value="上傳Logo" onclick="upload()"/>
<img id="img1" alt="網站Logo" src="images/weblogo.jpg" />
</form>
</body>
</html>
4. js 怎麼載入外部html文件
比如說,現在有一個外部的html文件test.html,內容是:
<inputtype="button"value="外部文件按鈕"/>
<p>外部文件p標簽</p>
現在在這個網頁中載入test.html中的內容,這個網頁的源碼為:
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/>
<title></title>
<scriptsrc="../Scripts/jquery-1.8.2.min.js"></script>
<scripttype="text/javascript">
functionGetHtml(){
$.ajax({
type:"POST",
url:'Handler.ashx',//提交到一般處理程序請求數據
success:LoadHtml
});
}
functionLoadHtml(data){
vardiv=document.getElementById("out");
div.innerHTML=data;//注意這里,要是想展示test.heml中的內容就用這個,如果顯示源代碼則用innerText
}
</script>
</head>
<body>
<inputtype="button"value="載入外部Html文件內容"onclick="GetHtml()"/>
<divid="out">
</div>
</body>
</html>
上面腳本中寫的Handler.ashx是一個一般處理程序,代碼是這樣的:
publicvoidProcessRequest(HttpContextcontext)
{
context.Response.ContentType="text/plain";
stringhtml=GetOutsideContent("test.html");
context.Response.Write(html);
}
(stringPath)
{
try
{
StreamReadersr=newStreamReader(HttpContext.Current.Server.MapPath(Path),System.Text.Encoding.GetEncoding("utf-8"));
stringcontent=sr.ReadToEnd().ToString();
sr.Close();
returncontent;
}
catch
{
return"錯誤";
}
}
publicboolIsReusable
{
get
{
returnfalse;
}
}
這是asp.net下的,如果你是使用其他語言的都大同小異,從後台讀取文件中的內容,使用Ajax獲取後台傳遞的文件中的內容,思路就是這樣。