日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當(dāng)前位置: 首頁 > 前端技术 > javascript >内容正文

javascript

JavaScript调用Web Services实现无刷新三联动

發(fā)布時間:2023/12/13 javascript 28 豆豆
生活随笔 收集整理的這篇文章主要介紹了 JavaScript调用Web Services实现无刷新三联动 小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.

http://singlepine.cnblogs.com/articles/301009.html

?


使用微軟提供的webservice.htc實(shí)現(xiàn)通過JavaScript調(diào)用WebService.
1.首先從微軟網(wǎng)站上下載webservice.htc,我附件源代碼也包含,不下載也可以
http://msdn.microsoft.com/workshop/author/webservice/webservice.htc
2.在網(wǎng)頁BODY中添加一個DIV,實(shí)現(xiàn)對webservice.htc的引用

<div?id="service"?style="BEHAVIOR:url(webservice.htc)"></div>
3.編寫JavaScript,實(shí)現(xiàn)對WebService的引用:
function?window_onload()?
????????????
{
????????????????service.useService(
"/Service1.asmx?WSDL","myselect");
????????????????str_province
=service.myselect.callService(province_Result,"getProvince");
????????????}
useService 語法:
sElementID.useService(sWebServiceURL, sFriendlyName [, oUseOptions])
useService 參數(shù):

sElementIDRequired. The of the element to which the behavior is attached.
sWebServiceURLRequired. String specifying the URL of the Web Service, using one of the following path types. See the examples section, where several variations of this parameter are shown.
Web Service file nameA Web service file, which has an .asmx file extension. This short form of the URL is sufficient, provided that the Web service is located in the same folder as the Web page using the WebService behavior. In this case, the ?WSDL query string is assumed by the behavior.
WSDL file nameA Web Services Description Language (WSDL) file name. The WSDL file must have a .wsdl file extension.
Full file pathFull path to a WebService (.asmx) or WSDL (.wsdl) file. A file path to a Web Service must include the ?WSDL query string. Either a local file path or a URL can be specified.
Relative pathA relative path to a WebService (.asmx) or WSDL (.wsdl) file. A file path to a Web Service must include the ?WSDL query string.
sFriendlyNameRequired. String representing a friendly name for the Web Service URL.
oUseOptionsOptional. An instance of the object.

callService語法:
iCallID = sElementID.sFriendlyName.callService( [oCallHandler], fo, oParam)
callService參數(shù):
sElementIDRequired. The of the element to which the behavior is attached.
sFriendlyNameRequired. The friendly name for the Web Service, which is defined by calling the method.
oCallHandlerOptional. Name of a script callback function that handles the results returned from this instance of the method call.
foRequired. One of the following possible values.
strFuncNameA String representing the name of the remote function being called. The String must be bounded by single or double quotation marks.
objCallA object, which has the necessary properties defined to call a remote function.
oParamRequired. One or more comma-delimited parameters, which are passed to the method name specified by fo.

4.建立WebService,代碼如下
public?class?Service1?:?System.Web.Services.WebService
????
{
????????
public?static?string?ConnectionString=System.Configuration.ConfigurationSettings.AppSettings["ConnectionString"];
????????SqlConnection?conn
=new?SqlConnection(ConnectionString);

????????
public?Service1()
????????
{
????????????
//CODEGEN:?This?call?is?required?by?the?ASP.NET?Web?Services?Designer
????????????InitializeComponent();
????????}


????????
Component?Designer?generated?code#region?Component?Designer?generated?code
????????
????????
//Required?by?the?Web?Services?Designer?
????????private?IContainer?components?=?null;
????????????????
????????
/**////?<summary>
????????
///?Required?method?for?Designer?support?-?do?not?modify
????????
///?the?contents?of?this?method?with?the?code?editor.
????????
///?</summary>

????????private?void?InitializeComponent()
????????
{
????????}


????????
/**////?<summary>
????????
///?Clean?up?any?resources?being?used.
????????
///?</summary>

????????protected?override?void?Dispose(?bool?disposing?)
????????
{
????????????
if(disposing?&&?components?!=?null)
????????????
{
????????????????components.Dispose();
????????????}

????????????
base.Dispose(disposing);????????
????????}

????????
????????
#endregion

????????
????????
getProvince#region?getProvince
????????[WebMethod(
true)]
????????
public?string?getProvince()
????????
{
????????????
string?sql="select?*?from?province";
????????????SqlCommand?cmd
=new?SqlCommand(sql,conn);?

????????????cmd.Connection.Open();
????????????SqlDataReader?dr
=cmd.ExecuteReader();

????????????
string?s="";
????????????
while(dr.Read())
????????????
{
????????????????s?
+=?","?+?dr["provinceID"].ToString()?+?"|"?+?dr["province"].ToString();
????????????}

????????????
return?s;
????????}


????????
#endregion


????????
getCity#region?getCity
????????[WebMethod(
true)]
????????
public?string?getCity(string?provinceid)
????????
{
????????????
string?str="select?*?from?city?where?father?=?'"+provinceid+"'";
????????????SqlCommand?cmd
=new?SqlCommand(str,conn);?

????????????cmd.Connection.Open();
????????????SqlDataReader?dr
=cmd.ExecuteReader();

????????????
string?s="";
????????????
while(dr.Read())
????????????
{
????????????????s?
+=?","?+?dr["cityID"].ToString()?+?"|"?+?dr["city"].ToString();
????????????}

????????????
return?s;
????????}


????????
#endregion


????????
getArea#region?getArea
????????[WebMethod(
true)]
????????
public?string?getArea(string?cityid)
????????
{
????????????
string?str="select?*?from?area?where?father='"+cityid+"'";
????????????SqlCommand?cmd
=new?SqlCommand(str,conn);?

????????????cmd.Connection.Open();
????????????SqlDataReader?dr
=cmd.ExecuteReader();

????????????
string?s="";
????????????
while(dr.Read())
????????????
{
????????????????s?
+=?","?+?dr["areaID"].ToString()?+?"|"?+?dr["area"].ToString();
????????????}

????????????
return?s;
????????}

????????
#endregion

????}
5.建立測試頁面
<HTML>
????
<HEAD>
????????
<title>jsWebServices</title>
????????
<meta?name="GENERATOR"?Content="Microsoft?Visual?Studio?.NET?7.1">
????????
<meta?name="CODE_LANGUAGE"?Content="C#">
????????
<meta?name="vs_defaultClientScript"?content="JavaScript">
????????
<meta?name="vs_targetSchema"?content="http://schemas.microsoft.com/intellisense/ie5">
????????
<script?language="javascript">
????????
<!--????????????
????????????
var?str_province;
????????????
var?str_city;
????????????
var?str_area;

????????????
function?window_onload()?
????????????
{
????????????????service.useService(
"/Service1.asmx?WSDL","myselect");
????????????????str_province
=service.myselect.callService(province_Result,"getProvince");
????????????}


????????????
function?province_Result(result)
????????????
{????????????????
????????????????
if(!result.error)
  ????????????
{  ????????????????
    ????????????document.all(
"select_province").length=0;    ????????????
    ????????????
if(result.value.substring(0,1)==",")
????????????????????????result.value?
=result.value.substring(1,result.length);
    ????????????
var?piArray?=?result.value.split(',');
    ????????????
for(var?i=0;i<piArray.length;i++)
    ????????????
{
      ????????????
var?ary1?=?piArray[i].toString().split('|');
      ????????????document.all(
"select_province").options.add(new?Option(ary1[1].toString(),ary1[0].toString()));
    ????????????}
    ????????????
  ????????????}

????????????}


????????????
function?province_onchange()?
????????????
{
????????????????
var?province=document.getElementById("select_province");
????????????????
var?pindex?=?province.selectedIndex;
????????????????
var?pValue?=?province.options[pindex].value;
????????????????
var?pText??=?province.options[pindex].text;
????????????????str_city
=service.myselect.callService(city_Result,"getCity",pValue);
????????????}


????????????
function?city_onchange()?
????????????
{
????????????????
var?city=document.getElementById("select_city");
????????????????
var?cindex?=?city.selectedIndex;
????????????????
var?cValue?=?city.options[cindex].value;
????????????????
var?cText??=?city.options[cindex].text;
????????????????str_area
=service.myselect.callService(area_Result,"getArea",cValue);
????????????}


????????????
function?city_Result(result)
????????????
{
????????????????
if(!result.error)
  ????????????
{
    ????????????document.all(
"select_city").length=0;
    ????????????
if(result.value.substring(0,1)==",")
????????????????????????result.value?
=result.value.substring(1,result.length);
    ????????????
var?piArray?=?result.value.split(",");
    ????????????
for(var?i=0;i<piArray.length;i++)
    ????????????
{
      ????????????
var?ary1?=?piArray[i].toString().split("|");
      ????????????document.all(
"select_city").options.add(new?Option(ary1[1].toString(),ary1[0].toString()));
    ????????????}

  ????????????}

????????????}


????????????
function?area_Result(result)
????????????
{
????????????????
if(!result.error)
  ????????????
{
    ????????????document.all(
"select_area").length=0;
    ????????????
if(result.value.substring(0,1)==",")
????????????????????????result.value?
=result.value.substring(1,result.length);
    ????????????
var?piArray?=?result.value.split(",");
    ????????????
for(var?i=0;i<piArray.length;i++)
    ????????????
{
      ????????????
var?ary1?=?piArray[i].toString().split("|");
      ????????????document.all(
"select_area").options.add(new?Option(ary1[1].toString(),ary1[0].toString()));
    ????????????}

  ????????????}

????????????}

????????????
//-->
????????
</script>
????
</HEAD>
????
<body?MS_POSITIONING="GridLayout"?onload="return?window_onload()">
????????
<div?id="service"?style="BEHAVIOR:url(webservice.htc)"></div>
????????
<form?id="Form1"?method="post"?runat="server">
????????????
<SELECT?id="select_province"?onchange="province_onchange();"?style="Z-INDEX:?101;?LEFT:?8px;?WIDTH:?128px;?POSITION:?absolute;?TOP:?16px">
????????????????
<OPTION?selected></OPTION>
????????????
</SELECT><SELECT?id="select_city"?onchange="city_onchange();"?style="Z-INDEX:?102;?LEFT:?160px;?WIDTH:?128px;?POSITION:?absolute;?TOP:?16px">
????????????????
<OPTION?selected></OPTION>
????????????
</SELECT><SELECT?id="select_area"?style="Z-INDEX:?103;?LEFT:?304px;?WIDTH:?128px;?POSITION:?absolute;?TOP:?16px">
????????????????
<OPTION?selected></OPTION>
????????????
</SELECT>
????????
</form>
????
</body>
</HTML>6.引用webservicers
7.數(shù)據(jù)庫腳本
if?exists?(select?*?from?dbo.sysobjects?where?id?=?object_id(N'[dbo].[area]')?and?OBJECTPROPERTY(id,?N'IsUserTable')?=?1)
drop?table?[dbo].[area]
GO

if?exists?(select?*?from?dbo.sysobjects?where?id?=?object_id(N'[dbo].[province]')?and?OBJECTPROPERTY(id,?N'IsUserTable')?=?1)
drop?table?[dbo].[province]
GO

if?exists?(select?*?from?dbo.sysobjects?where?id?=?object_id(N'[dbo].[city]')?and?OBJECTPROPERTY(id,?N'IsUserTable')?=?1)
drop?table?[dbo].[city]
GO

CREATE?TABLE?[dbo].[area]?(
????
[id]?[int]?NOT?NULL?,
????
[areaID]?[nvarchar]?(50)?COLLATE?Chinese_PRC_CI_AS?NULL?,
????
[area]?[nvarchar]?(60)?COLLATE?Chinese_PRC_CI_AS?NULL?,
????
[father]?[nvarchar]?(6)?COLLATE?Chinese_PRC_CI_AS?NULL?
)?
ON?[PRIMARY]
GO

CREATE?TABLE?[dbo].[province]?(
????
[id]?[int]?NOT?NULL?,
????
[provinceID]?[nvarchar]?(6)?COLLATE?Chinese_PRC_CI_AS?NULL?,
????
[province]?[nvarchar]?(40)?COLLATE?Chinese_PRC_CI_AS?NULL?
)?
ON?[PRIMARY]
GO

CREATE?TABLE?[dbo].[city]?(
????
[id]?[int]?NOT?NULL?,
????
[cityID]?[nvarchar]?(6)?COLLATE?Chinese_PRC_CI_AS?NULL?,
????
[city]?[nvarchar]?(50)?COLLATE?Chinese_PRC_CI_AS?NULL?,
????
[father]?[nvarchar]?(6)?COLLATE?Chinese_PRC_CI_AS?NULL?
)?
ON?[PRIMARY]
GO8.下載真實(shí)數(shù)據(jù)/Files/singlepine/area.rar
9.源代碼下載/Files/singlepine/jsWebServices.rar

?

轉(zhuǎn)載于:https://www.cnblogs.com/291099657/archive/2009/04/09/1432493.html

總結(jié)

以上是生活随笔為你收集整理的JavaScript调用Web Services实现无刷新三联动的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯,歡迎將生活随笔推薦給好友。