ajax和div的问题

前台函数：function Setdis(isShow)
      {
        if(!isShow)
        {
          document.getElementById("div1").style.display="none";
        }
        else
        {
          document.getElementById("div1").style.display="block";
        }
        return false;
      }DIV<asp:LinkButton ID="lbtn1" runat="server" onclientclick="return Setdis(true)">点我弹DIV</asp:LinkButton>
<div id="pts" style="display:none">
<asp:button id="xx" runat="server" text="点我" />
</div>
页面用了ajax，然后当点击ltn1时div显示出来了，但是点击xx这个按钮的时候，div又消失了。求解。

解决方案 »

  1.   

    点击了xx以后重新加载了页面，DIV随之消失
      

  2.   

    DIV中的这个XX按钮是做什么用的?会不会导致了回发,页面刷新了.
      

  3.   

    点击xx这个按钮的时候,就是点击服务器控件，回传机制 当然提交啦 这里又没有采用ajax
      

  4.   

    给你个案例看看，回发是肯定的，但是不刷新，这是HTML代码，只能实现弹出层，其实ajax就很简单了<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title><style type="text/css">
    body
    {
     font-family:微软雅黑;
     font-size:12px; 
    }
    .TD_L
    {
    background-color:#eef2fb;
    padding-left:5px;
    text-align:left;
    width:50px;


    }
    .TD_R
    {
    background-color:#eef2fb;
    padding-left:5px;
    text-align:left;
    width:450px;

    }
    .btn
    {
    border:1px #CCCCCC solid;
    background-color:#eef2fb;
    color: #999999;
    width:70px;
    padding-top:2px;
    padding-bottom:2px;
    height:20px;
        
    }
    .txt
    {

    width:130px;
    height:13px;

    }body,p,div,ul,ol{padding:0;margin:0;border:0;}
    body{height:100%;font-size:12px;}
    .bgLayer{ background:#000; opacity:0.5; filter:alpha(opacity=50);z-index:10001;position:absolute;left:0;top:0;}
    .boxLayer{ background:#fff; border-right:1px solid #8aa9cd;border-left:1px solid #8aa9cd;border-bottom:1px solid #8aa9cd;overflow:hidden; zoom:1; z-index:10002; position:absolute;padding:0px;}
    .boxLayer p{padding:0px ;text-align:center;}
    .alldenglu{
        width:260px;}
    .denglu {
    font-size: 14px;
    padding-top:5px;
    padding-bottom:5px;
    padding-left:5px;
    padding-right:5px;
    color: #FFFFFF;
    background-image:url(/blog/images/Top_bg.jpg);}
    </style>
    <script type="text/javascript">
    //<![CDATA[
    //弹出层 by ChenLiang v1.0
    function LightBox(boxWidth,boxHeight,boxContent)
    {
    this.boxWidth=boxWidth;
    this.boxHeight=boxHeight;
    this.boxContent=boxContent;
    var bgLayer,boxLayer;
    var documentHtml=document.documentElement;
    this.createBgLayer=function()
    {
    bgLayer = document.createElement("div");
    with (bgLayer)
    {
    className="bgLayer";
    style.width=documentHtml.scrollWidth+"px";
    style.height=documentHtml.scrollHeight+"px";
    style.display="none";
    }
    document.body.insertBefore(bgLayer,document.body.firstChild);
    };
    this.createBox=function(){
    boxLayer = document.createElement("div");
    with (boxLayer)
    {
    className = "boxLayer";
    style.width=this.boxWidth + "px";
    style.height = this.boxHeight +"px";
    style.display="none";
    };
    document.body.insertBefore(boxLayer,document.body.firstChild);
    };
    this.init= function()
    {
    this.createBgLayer();
    this.createBox();
    }
    // if IE 6.0
    function hideShowSelect(obj)
    {
    if (window.navigator.userAgent.indexOf("MSIE 6.0") > 0)
    {
    var selectDom = document.getElementsByTagName("select");
    for (var i = 0; i < selectDom.length ; i++)
    {
    if (obj)
    selectDom[i].style.display="none";
    else
    selectDom[i].style.display="";
    }
    }
    };
    this.show = function()
    {
    hideShowSelect(true);
    boxLayer.innerHTML=this.boxContent;
    bgLayer.style.display = "block";
    boxLayer.style.display = "block";
    boxLayer.style.left = documentHtml.offsetWidth /2 - boxLayer.offsetWidth/2 +"px";
    boxLayer.style.top = documentHtml.scrollTop + documentHtml.offsetHeight/2 - this.boxHeight/2 -30 + "px";
    }
    this.hide = function()
    {
    hideShowSelect(false);
    bgLayer.style.display = "none";
    boxLayer.style.display = "none";
    }
    }//]]>
    </script>
    <script type="text/javascript">
    //调用方法
    var loadBox= new LightBox(400,110);
    window.onload=function(){
    loadBox.init();
    loadBox.boxContent='<table style="width:400px;" cellspacing="0" cellpadding="0" border="0"><tr class="denglu"><td ><strong>添加日志分类</strong></td><td ><a onclick="loadBox.hide()" style="cursor:hand;color:#8B1A1A;">关闭</a></td></tr><tr><td style="padding-top:15px;padding-left:5px;padding-bottom:15px;"><div  class="" colspan="2" align="right">分类名称:&nbsp;&nbsp;&nbsp;&nbsp;<input maxlength="12" class="txt" id="MSG_Model" type="text" name="username" value="" size="35">&nbsp;(最多12个字母或6个汉字)</div></td></tr><tr style="background-image:url(/blog/images/di_bg.jpg);"><td colspan="2" align="right" style="padding-top:3px;padding-bottom:3px;padding-right:15px;"><div  class=""><input type="button" onclick="ModelAdd()"  value="确定" class="btn" onclick="return checkform()" /> <input  class="btn" type="button" value="取消" /></div></td></tr></table>';
    }function ModelAdd()
    {
       var title=document.getElementById("MSG_Model").value;
      
       AjaxMethod.BBS_Model_Add(title,ModelAdd_CallBack);
    }
    function ModelAdd_CallBack(response)
    {
        if ((response.value != null)&&(response.value>0))
        {
            alert("添加成功!");
            loadBox.hide();
        }
    }</script> 
    </head><body><div>
       <h1 style=" font-size:16px;">发表日志</h1>
    <table cellspacing="1" cellpadding="1" style="width:880px; background-color:#CCCCCC;" border="0">
        <tr>
    <td class="TD_L" >分类：</td>
    <td  class="TD_R"  >
                <asp:DropDownList ID="ddl_MSG_Type" runat="server">     
                </asp:DropDownList>&nbsp;&nbsp;&nbsp;<a  onClick="loadBox.show()" style="cursor:hand;">添加分类</a>
    </td>
    </tr>
    <tr>
    <td class="TD_L">主题：</td>
    <td  class="TD_R" style="width:600px;"><asp:TextBox id="txt_MSG_Title" runat="server"  CssClass="txt" style="width:360px;"></asp:TextBox>&nbsp;&nbsp;*主题内容请勿超过100汉字 </td>
    </tr> <tr>
    <td align="center" colspan="2" style="background-color:#e0e0e0;">
    <asp:Button ID="btnSave" runat="server" Text=" 保 存 " 
                    style="background-color:#d0d0d0;border:1px solid #999999; width:70px;padding-top:3px;" 
                    OnClientClick="return checkForm();" onclick="btnSave_Click" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
    <input id="btn_GoBack" style="background-color:#d0d0d0;border:1px solid #999999; width:70px;padding-top:3px;" type="button" value=" 返 回 " onclick="history.go(-1);" /> </td>
    </tr>
    </table>
    </div>
    </body>
    </html>直接粘贴运行，点添加分类就可以弹出层，在里面有写ajax方法，后台的自己配上吧
      

  5.   

    button点击就会回发。可以用Html控件么
      

  6.   

    有没有好的解决方法，div为display：none的情况下，通过函数让div显示出来后，击asp:button，让div不消失。
      

  7.   

    既然用到了ajax,就别在放入服务器控件了,你放服务器控件,点击后不回发才怪
      

  8.   

    直接用<input type=button>不行? 你这里要这个asp:button的作用是?
      

  9.   

    我试了一下,没消失哦!!
    把你的代码放在UpdataPanel里,如下:
        <asp:UpdatePanel ID="UpdatePanel1" runat="server">
            <ContentTemplate>
                <asp:LinkButton ID="lbtn1" runat="server" OnClientClick="return Setdis(true)">点我弹DIV</asp:LinkButton>
                <div id="div1" style="display: none">
                    <asp:Button ID="xx" runat="server" Text="点我" />
                </div>
            </ContentTemplate>
        </asp:UpdatePanel>
      

  10.   

    兄弟 你要实现啥效果呢   
    你用的 那个按钮是  服务器控件，点击后肯定是要刷新页面的  所以你点XX 就会消失
    不防  你看看  Jquery 这个挺好用的 
      

  11.   

    你的XX要实现什么效果那，XX会回发的啊