• JS自制复选框与asp.net交互


    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head runat="server">
        <title>无标题页</title>
        
    <style type="text/css">
    .test{ float: left; height: 30px; width: 100px; line-height: 30px; margin: 30px; border: 1px solid #CCC; }
    .test2{ float: left; height: 30px; width: 100px; line-height: 30px; margin: 30px; border: 1px solid #CCC; background-color: #CCC; }
    .test a{ display: block; }
    </style>
    
    </head>
    <body>
        <form id="form1" runat="server">
        
        <div name="docname" class="test" id="a0" onClick="settt('a0')">我在A1处 </div>
    <div name="docname" class="test" id="a1" onClick="settt('a1')">我在A2处 </div>
    <div name="docname" class="test" id="a2" onClick="settt('a2')">我在A3处 </div>
    <div name="docname" class="test" id="a3" onClick="settt('a3')">我在A4处 </div>
    <div name="docname" class="test2" id="a4" onClick="settt('a4')">我在A5处 </div>
    <div name="docname" class="test" id="a5" onClick="settt('a5')">我在A6处</div>
    <div class="test" >获取图片</div>
        
    <script type="text/javascript">
    function settt(obj)
    {
        //alert(document.getElementById(obj).className);
        if(document.getElementById(obj).className == "test2")
         {  document.getElementById(obj).className = "test"; }
        else
         { document.getElementById(obj).className = "test2";}
    }
    //alert(document.getElementsByName("docname")[1].innerText);
    //alert(document.getElementsByName("docname")[1].innerHTML);
    //alert(document.getElementById("a1").innerText );
    //alert(document.getElementsByName("docname").length)
    function getpic()
    {
        len = document.getElementsByName("docname").length
        var arr = new Array();
        var test="";
        var add="";
          for(i=0;i<len;i++){
              if(document.getElementById("a"+i).className == "test2")
              {
                test += document.getElementsByName("docname")[i].innerHTML;
              }
              
          }
          
          if(test == "")
          { alert("为空哦"); }
          else
          { 
          document.getElementById("TextBox1").value = test;
          alert(test); }
    }
    
    </script>
    
            <p>
            <asp:TextBox ID="TextBox1" runat="server" Font-Size="26pt"></asp:TextBox></br>
    
            <asp:Button ID="Button1" runat="server" Height="49px" OnClientClick="getpic()" onclick="Button1_Click"  Text="Button" Width="135px" />
        </p>
        </form>
        
    </body>
    </html>
    public partial class jsdom : System.Web.UI.Page
        {
            protected void Page_Load(object sender, EventArgs e)
            {
    
            }
    
            protected void Button1_Click(object sender, EventArgs e)
            {
                Response.Write(TextBox1.Text.ToString());
            }
        }
  • 相关阅读:
    修改css样式+jq中的效果+属性操作+元素操作
    案例1:点击菜单显示相应的图片
    jq容易混淆点
    jQuery中的选择器
    JQ基本
    arguments的使用
    函数方法
    forEach遍历
    数组中常用的方法
    数组 Array
  • 原文地址:https://www.cnblogs.com/chixiaojin/p/2976893.html
Copyright © 2020-2023  润新知