常用js，css_常用js css-优快云博客

本文链接：https://blog.youkuaiyun.com/luobaobin/article/details/50684722

本文介绍了如何使用jQuery轻松选择和操作HTML元素，包括选择所有元素、特定元素和使用事件来实现交互。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<html >
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="jq.js"></script>
    <script>
        function select_all(chk,obj)
        {

            var input = document. getElementsByName(chk);
            var shop_select_state=obj;

            if(shop_select_state.checked==true)
            {
                for (var i=0;i<input.length ;i++ )
                {
                    if(input[i].type=="checkbox")
                        input[i].checked = true;
                }
            }
            else
            {
                for (var i=0;i<input.length ;i++ )
                {
                    if(input[i].type=="checkbox")
                        input[i].checked = false;
                }
            }
        }

        function add_shop_id()
        {
            var shop_id=get_chk_ids('chkshopID');
            document.getElementById('sds').value=shop_id;
            $('#selectpop').hide();
        }
        function get_chk_ids(chk_obj)
        {
            var chkOrderObjects = document.getElementsByName(chk_obj);
            var orderids ='';

            iLength = chkOrderObjects.length;
            if (iLength == 0) return;

            for (var i = 0 ; i < iLength; i=i+1)
            {
                if ( chkOrderObjects[i].checked == true )
                {
                    var orderid =chkOrderObjects[i].value;
                    if (orderids)
                    {
                        orderids= orderids+',' +orderid;
                    }
                    else
                    {
                        orderids= orderid;
                    }
                }
            }
            return orderids;
        }
         //正则

//var preg = /^([a-zA-Z0-9])([a-zA-Z1-9,])*([a-zA-Z0-9])$/;  //if(!preg.test(x)){  //msg += "排除x含非法字符(只允许英文字符、数字、英文逗号)"; //}

</script> <style type="text/css"> #selectpop{position:absolute;left:20%;top:20%;width:500px;height:400px;background:#f4f4f4;border:1px solid #ccc;overflow-y:scroll;} .errorpop { position: absolute; width: 100%; top: 30%; left: 0; z-index: 100000000; text-align: left; } .errorpop .popup {position:relative;} .tips{ position:relative; top:8px} .tips font{ position:relative; top:-8px;} div.tips span { display: none; } .text_overflow { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width:140px; } div.tips:hover span { background-color: #ffffff; border: 2px solid #95b8e7; display: block; font-size: 12px; font-weight: normal; color:#000000; height: auto; left: 11.3em; padding: 10px; position: absolute; display:inline; text-align: left; text-decoration: none; top: -1em; width: 180px; z-index: 9999; -moz-border-radius: 15px; -webkit-border-radius: 15px; border-radius:5px; } .tips { cursor: pointer; } </style></head><body><div class="tips"><font class="text_overflow">aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbb</font><span style="width:380px;white-space:pre-wrap; padding:8px;word-wrap:break-word;">aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbb</span></div><br/><input type="button" class="button" value="选择店铺" οnclick="$('#selectpop').show();">  <span id="span_sdmc" ></span><div id="selectpop" class="errorpop" style="display:none;"> <div class="popup"> <table> <tbody> <tr> <td class="tl"></td> <td class="b"></td> <td class="tr"></td> </tr> <tr> <td class="b"></td> <td class="body"><div class="list-div" id="listDiv" align="center" style="width:100%;"> <table class="poptable" cellpadding="0" cellspacing="0"> <tr> <th><input οnclick='select_all("chkshopID",this)' type="checkbox" id='shop_select' /> 店铺编号</th> <th> 店铺名称 </th> </tr> <tr> <td><input type="checkbox" name="chkshopID" value="1" id="chkshopID_1" /> </td> <td>店铺1</td> </tr> <tr> <td><input type="checkbox" name="chkshopID" value="2" id="chkshopID_2" /> </td> <td>店铺2</td> </tr> <tr> <td colspan="2"><input type='button' value='确定' onclick ="add_shop_id()"> </input> </td> </tr> </table> </div> <div class="clear"></div> <div class="footer"> <a href="javascript:void(0);" class="close" οnclick="$('#selectpop').hide();"><img src="images/closelabel.gif" title="close" class="close_image" /></a> </div></td> <td class="b"></td> </tr> <tr> <td class="bl"></td> <td class="b"></td> <td class="br"></td> </tr> </tbody> </table> <input type="hidden" name="sds" id="sds" value="" /> </div></div></body></html>

$("#pencil").show();
var offset = $(obj).offset();
$("#pencil").css('position','absolute').css("left",offset.left+30+"px").css("top",offset.top +"px")
        .width('14px');