求高手 JS限制向层中添加内容

通过按钮把选用的信息用cookie放到了隐藏层中，
希望实现 
1.当选择三家酒店，在次点击加入对比时 ，提示用户“您只能选择三家酒店进行比”。
<link rel="stylesheet" rev="stylesheet" href="http://www.elongstatic.com/common/css/elong_common.css?201101101435"   type="text/css" media="all" />
  <link rel="stylesheet" rev="stylesheet" href="http://www.elongstatic.com/hotels/css/Domestic_hotels201005.css?201101101435"   type="text/css" media="all" /> 
<body>
       <div id="shuliang">
    <li><a href="#?">
            <span class="Add">北京西苑饭店</span></a>
            <input type="button" mth="showcompare" title="对比" value="加入对比"  onclick="addcookie('40','北京西苑饭店')">
</li>

        <li><a href="#?">
            <span class="Add">北京艺海商务酒店</span></a>
            <input type="button"  value="加入对比" mth="showcompare"   onclick="addcookie('41','北京艺海商务酒店')">
</li>

        <li><a href="#?" >
            <span class="Add">北京金龙潭大饭店</span></a>
            <input type="button" value="加入对比"  mth="showcompare"    onclick="addcookie('42','北京金龙潭大饭店')">
</li>

        <li><a href="#?" >
            <span class="Add">北京美泉宫饭店</span></a>
            <input type="button" value="加入对比" mth="showcompare"  onclick="addcookie('43','北京美泉宫饭店')">
</li>

        <li><a href="#?">
            <span class="Add">富驿时尚酒店（北京中关村店）</span></a>
            <input type="button" value="加入对比" mth="showcompare"  onclick="addcookie('44','富驿时尚酒店（北京中关村店）')">
</li>
</div>
<div style="display:none; " id="contrast" onClick="hidden() " > aaaaaaaaa</div><div id="contrast_flayer" style="display:none;">
  <h2>
   <span class="right pr5 pt5">
  <a  id="compareClose" href="#?" class="com_close" ></a>
</span>开始对比
 </h2> 
   <div class="box" id="dvCompare" >
    <ul>
    </ul>
   </div>
   <p class="box">
      <input type="button"  value="开始对比" onmouseout="this.className='com_search75'" onmouseup="this.className='com_search75'" onmousedown="this.className='com_search75_an'" class="com_search75">
   &nbsp;&nbsp; <a href="#?" onclick="clearAllCookies()" title="清空">清空</a>
</p>
<p class="box"><a href="#" onclick="cl()">收起</a></p>
   </div>
</body>
</html>

解决方案 »

  1.   


    思路我明白，是这样么document.getElementById("shuliang").innerTEXT
      

  2.   

    不对
    alert(document.getElementById("shuliang").getElementsByTagName("div").length);
      

  3.   

    if(document.getElementById("shuliang").getElementsByTagName("biaoqian").length > 3 )
    {
     alert ("以满足对比数量");
    }
      

  4.   

    测试通过
    <!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=gb2312" />
    <title>无标题文档</title>
    <script type="text/javascript">
    function add()
    {
    if(document.getElementById("shuliang").getElementsByTagName("div").length >= 3)
    {
    alert("只能加入三个对比");
    }
    else
    {
    document.getElementById("shuliang").innerHTML = document.getElementById("shuliang").innerHTML + "<div>aaaa</div>"
    }}
    </script></head><body>
    <div id="shuliang">
    </div><input type="button" onclick="add()" value="add"/>
    </body>
    </html>
      

  5.   


    你看看，还是不可以function addcookie(hotelid,hotelname)
      {
        if(document.getElementById("shuliang").getElementsByTagName("div").length >= 3 )
    {
      alert("只能加入三个对比");
    }else{
    setCookie("hotelid",hotelid);
    setCookie("hotelname",hotelname);
    show();
      }  }
    <div id="shuliang" >
        <li><a href="#?">
                <span class="Add">北京西苑饭店</span></a>
                <input type="button" mth="showcompare" title="对比" value="加入对比"  onclick="addcookie('40','北京西苑饭店')">
    </li>
      

  6.   

      if(document.getElementById("shuliang").getElementsByTagName("li").length >= 3 )
      

  7.   

    if(document.getElementById("shuliang").getElementsByTagName("li").length >= 3 )
      

  8.   

    为什么你们不用jquery呢？？？
      

  9.   

    先看看每次进来这个结果是多少alert(document.getElementById("shuliang").getElementsByTagName("li").length);
      

  10.   

    5 ，输出的这个5是li中的，并不是隐藏层中的，隐藏层是   <div class="box" id="dvCompare" >
        <ul>
        </ul>
       </div>但是这样我改成 document.getElementById("dvCompare").getElementsByTagName("ul").length >= 3
    后，并不作判断了
      

  11.   

    <script language="javascript">
    function addcookie(hotelid,hotelname)
      {
        if(document.getElementById("dvCompare").getElementsByTagName("div").length >= 3 )
    {
      alert("只能加入三个对比");
    }else{
    setCookie("hotelid",hotelid);
    setCookie("hotelname",hotelname);
    show();
      }  }function setCookie(name,value)//两个参数，一个是cookie的名子，一个是值
    {
     document.cookie = name + "="+ getCookie(name) + escape (value)  + ","; 
    }function getCookie(name)
    {
    　　 var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
    　　 if(arr != null) return unescape(arr[2]); return '';
    }function deleteAllCookie(name) 
        {
                var date = new Date();
                date.setTime(date.getTime() - 10000); //删除一个cookie，就是将其过期时间设定为一个过去的时间
                document.cookie = name + "=删除" + "; expires=" + date.toUTCString();
        }function delCookie(n)
    {
    var hotelid = getCookieArray('hotelid');
    var hotelname = getCookieArray('hotelname');
    deleteAllCookie('hotelid');
    deleteAllCookie('hotelname');
    for (var i=0;i<hotelid.length-1;i++)
    {
    if (i != n) 
    {
    setCookie("hotelid",hotelid[i]);
    setCookie("hotelname",hotelname[i]);
    }
    }
    show();
    }function getCookieArray(name)
    {
    return getCookie(name).split(",");  
    }function show()
    {
    var content = '';
    var hotelid = getCookieArray('hotelid');
    var hotelname = getCookieArray('hotelname');

    for (var i=0;i<hotelid.length-1;i++)
    {
    content += '<input type="checkbox" value="'+i+'">' + hotelname[i] + '&nbsp;&nbsp<a href="#" onclick=delCookie("'+i+'")>删除</a><br>';
    }
    document.getElementById("dvCompare").innerHTML=content; 
    document.getElementById("contrast_flayer").style.display="block";  
    }

    function cl()
    {
     document.getElementById("contrast_flayer").style.display="none"; 
            document.getElementById("contrast").style.display="block"; 
    }
    function hidden()
        {
            document.getElementById("contrast_flayer").style.display="block"; 
            document.getElementById("contrast").style.display="none"; 
        } function clearAllCookies()
    {
    var LSTR_Cookie = window.document.cookie;
    var LREG_Cookie = new RegExp().compile("([^;]+=)[^;]+","g");
    var LARY_cookie = null;

    while(LARY_cookie = LREG_Cookie.exec(LSTR_Cookie))
    {
    window.document.cookie = LARY_cookie[1]
    }
    show();
    } </script>
      <link rel="stylesheet" rev="stylesheet" href="http://www.elongstatic.com/common/css/elong_common.css?201101101435"   type="text/css" media="all" />
      <link rel="stylesheet" rev="stylesheet" href="http://www.elongstatic.com/hotels/css/Domestic_hotels201005.css?201101101435"   type="text/css" media="all" /> 
    <body>
           <div id="shuliang" >
        <li><a href="#?">
                <span class="Add">北京西苑饭店</span></a>
                <input type="button" mth="showcompare" title="对比" value="加入对比"  onclick="addcookie('40','北京西苑饭店')">
    </li>

            <li><a href="#?">
                <span class="Add">北京艺海商务酒店</span></a>
                <input type="button"  value="加入对比" mth="showcompare"   onclick="addcookie('41','北京艺海商务酒店')">
    </li>

            <li><a href="#?" >
                <span class="Add">北京金龙潭大饭店</span></a>
                <input type="button" value="加入对比"  mth="showcompare"    onclick="addcookie('42','北京金龙潭大饭店')">
    </li>

            <li><a href="#?" >
                <span class="Add">北京美泉宫饭店</span></a>
                <input type="button" value="加入对比" mth="showcompare"  onclick="addcookie('43','北京美泉宫饭店')">
    </li>

            <li><a href="#?">
                <span class="Add">富驿时尚酒店（北京中关村店）</span></a>
                <input type="button" value="加入对比" mth="showcompare"  onclick="addcookie('44','富驿时尚酒店（北京中关村店）')">
    </li>
    </div>
    <div style="display:none; " id="contrast" onClick="hidden() " > aaaaaaaaa</div><div id="contrast_flayer" style="display:none;">
      <h2>
       <span class="right pr5 pt5">
      <a  id="compareClose" href="#?" class="com_close" ></a>
    </span>开始对比
     </h2> 
       <div class="box" id="dvCompare" >
        <ul>
        </ul>
       </div>
       <p class="box">
          <input type="button"  value="开始对比" onmouseout="this.className='com_search75'" onmouseup="this.className='com_search75'" onmousedown="this.className='com_search75_an'" class="com_search75">
       &nbsp;&nbsp; <a href="#?" onclick="clearAllCookies()" title="清空">清空</a>
    </p>
    <p class="box"><a href="#" onclick="cl()">收起</a></p>
       </div>
    </body>
    </html>
      

  12.   

    if(document.getElementById("隐藏层的ID").getElementsByTagName("ul").length >= 3 )
      

  13.   


    我之前这样写回复过了，你看我上面所有的代码，我是添加cookie的
      

  14.   

    测试通过，我挣个分容易嘛，呵呵，开个玩笑，看了一下你做的东西，挺不错的……
    <script language="javascript">
    function addcookie(hotelid,hotelname)
      {
        if(document.getElementById("dvCompare").getElementsByTagName("input").length >= 3 )
            {
              alert("只能加入三个对比");
            }else{
                setCookie("hotelid",hotelid);
                setCookie("hotelname",hotelname);        
                show();
                  }  }function setCookie(name,value)//两个参数，一个是cookie的名子，一个是值
        {
             document.cookie = name + "="+ getCookie(name) + escape (value)  + ","; 
        }function getCookie(name)
        {
        　　 var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));
        　　 if(arr != null) return unescape(arr[2]); return '';
        }function deleteAllCookie(name) 
        {
                var date = new Date();
                date.setTime(date.getTime() - 10000); //删除一个cookie，就是将其过期时间设定为一个过去的时间
                document.cookie = name + "=删除" + "; expires=" + date.toUTCString();            
        }function delCookie(n)
        {
            var hotelid = getCookieArray('hotelid');
            var hotelname = getCookieArray('hotelname');
            deleteAllCookie('hotelid');
            deleteAllCookie('hotelname');
            for (var i=0;i<hotelid.length-1;i++)
            {
                if (i != n) 
                {
                    setCookie("hotelid",hotelid[i]);
                    setCookie("hotelname",hotelname[i]);
                }
            }
            show();
        }function getCookieArray(name)
        {
            return getCookie(name).split(",");     
        }function show()
        {
            var content = '';
            var hotelid = getCookieArray('hotelid');
            var hotelname = getCookieArray('hotelname');
            
            for (var i=0;i<hotelid.length-1;i++)
            {
                content += '<input type="checkbox" value="'+i+'">' + hotelname[i] + '&nbsp;&nbsp<a href="#" onclick=delCookie("'+i+'")>删除</a><br>';
            }
            document.getElementById("dvCompare").innerHTML=content; 
            document.getElementById("contrast_flayer").style.display="block";     
        }
        
        function cl()
            {    
             document.getElementById("contrast_flayer").style.display="none"; 
            document.getElementById("contrast").style.display="block"; 
            }
        function hidden()
        {
            document.getElementById("contrast_flayer").style.display="block"; 
            document.getElementById("contrast").style.display="none"; 
        }    function clearAllCookies()
        {
            var LSTR_Cookie = window.document.cookie;
            var LREG_Cookie = new RegExp().compile("([^;]+=)[^;]+","g");
            var LARY_cookie = null;
            
            while(LARY_cookie = LREG_Cookie.exec(LSTR_Cookie))
            {
                window.document.cookie = LARY_cookie[1]
            }
            show();
        } </script>
      <link rel="stylesheet" rev="stylesheet" href="http://www.elongstatic.com/common/css/elong_common.css?201101101435"   type="text/css" media="all" />
      <link rel="stylesheet" rev="stylesheet" href="http://www.elongstatic.com/hotels/css/Domestic_hotels201005.css?201101101435"   type="text/css" media="all" /> 
    <body>
           <div id="shuliang" >
            <li><a href="#?">
                <span class="Add">北京西苑饭店</span></a>
                <input type="button" mth="showcompare" title="对比" value="加入对比"  onclick="addcookie('40','北京西苑饭店')">
            </li>
            
            <li><a href="#?">
                <span class="Add">北京艺海商务酒店</span></a>
                <input type="button"  value="加入对比" mth="showcompare"   onclick="addcookie('41','北京艺海商务酒店')">
            </li>
            
            <li><a href="#?" >
                <span class="Add">北京金龙潭大饭店</span></a>
                <input type="button" value="加入对比"  mth="showcompare"    onclick="addcookie('42','北京金龙潭大饭店')">
            </li>
            
            <li><a href="#?" >
                <span class="Add">北京美泉宫饭店</span></a>
                <input type="button" value="加入对比" mth="showcompare"  onclick="addcookie('43','北京美泉宫饭店')">
            </li>
                
            <li><a href="#?">
                <span class="Add">富驿时尚酒店（北京中关村店）</span></a>
                <input type="button" value="加入对比" mth="showcompare"  onclick="addcookie('44','富驿时尚酒店（北京中关村店）')">
            </li>
            </div>
    <div style="display:none; " id="contrast" onClick="hidden() " > aaaaaaaaa</div><div id="contrast_flayer" style="display:none;">
      <h2>
          <span class="right pr5 pt5">
          <a  id="compareClose" href="#?" class="com_close" ></a>
        </span>开始对比
     </h2> 
       <div class="box" id="dvCompare" >
        <ul>
        </ul>
       </div>
          <p class="box">
          <input type="button"  value="开始对比" onmouseout="this.className='com_search75'" onmouseup="this.className='com_search75'" onmousedown="this.className='com_search75_an'" class="com_search75">
       &nbsp;&nbsp; <a href="#?" onclick="clearAllCookies()" title="清空">清空</a>
        </p>
        <p class="box"><a href="#" onclick="cl()">收起</a></p>
       </div>
    </body>
    </html>
      

  15.   


    哈哈，你想要分？那在给你个，这个成功了 谢谢
    http://topic.csdn.net/u/20110114/10/453e9d7c-13ba-4524-bb2f-faa679f7fca2.html?seed=1697091644&r=71221628#r_71221628