Jquery选择器参考:http://www.w3school.com.cn/jquery/jquery_selectors.asp
模态框:http://www.runoob.com/bootstrap/bootstrap-modal-plugin.html
获取class="a"元素点击:
$(".a").click(function() { var name1 = $(this).attr('name'); //$(this)是当前HTML元素,获取当前元素的name值 var value1 = $(this).attr('value'); //获取当前元素的value值 var n = name1.split(":")[0]; //按:分词
$("#tablelist option").remove(); //去掉id为tablelist的select标签下面的所有option标签(初始化select标签) $.post("/django/",{n:name1,v:value1},function(result){ var dict = eval("("+result+")"); //ajax返回的json数据需要通过eval方法被js使用 for (x in dict){ $("#db"+value1).append("<option>"+dict[x]+"</option>"); //在id为"db"+value1的元素中(示例假设是个select标签)添加<option>标签 } }); });
获取id为tablelist的select标签的点击事件
<script> $(document).ready(function() {
$("#privilegelist").children("li").remove(); //去除ul标签中所有的li标签 $("#tablelist").change(function() { $(this).children('option:selected').attr('value');
$(this).children('option:selected').text(); //获取选项值的文本 alert(); }); }); </script>
动态添加元素的事件,高版本live用on方法替换
$(".monitoritem").live('click',function() { var monitoritemname = $(this).attr('name'); $('#'+monitoritemname).remove(); });
遍历元素的子元素不含孙元素
$("#openmonitorpage").click(function() { var a = $('#monitoritemlist').children().length; alert(a); $('#monitoritemlist').children().each(function(){ alert($(this).attr("name")); }); });
使用jquery实现以post打开新窗口
function monitorpost(URL, PARAMS) { var temp_form = document.createElement("form"); temp_form.action = URL; temp_form.target = "_blank"; temp_form.method = "post"; temp_form.style.display = "none"; for (var x in PARAMS) { var opt = document.createElement("textarea"); opt.name = x; opt.value = PARAMS[x]; temp_form.appendChild(opt); } document.body.appendChild(temp_form); temp_form.submit(); } #调用 monitorpost('/mysqlmonitorlist/',{'a':'123'});
#鼠标浮动弹出层 $(".mousenameserver").mouseenter(function() { var instancegroup = $(this).attr('name'); var ps = $(this).position(); $("#"+instancegroup+"_nameserver").css("position", "absolute"); $("#"+instancegroup+"_nameserver").css("left", ps.left + 50); //距离左边距 $("#"+instancegroup+"_nameserver").css("top", ps.top + -20); //距离上边距 $("#"+instancegroup+"_nameserver").css("background", "#fff"); //距离上边距 $("#"+instancegroup+"_nameserver").show(); }); $(".mousenameserver").mouseleave(function() { var instancegroup = $(this).attr('name'); $("#"+instancegroup+"_nameserver").hide(); });
判断输入框ip合法性
转:http://blog.csdn.net/stpeace/article/details/26967713
<input id="xxx" onblur="fun();" /> <script> function isValidIP(ip) { var reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/ return reg.test(ip); } function fun() { var ip = document.all.xxx.value; if(isValidIP(ip)) { alert("yes"); } else { alert("no"); } } </script>
注意:
1、选择器中若使用变量,变量不能有点.
CSS
距离控制
margin-top: 5px;
margin-right:10px;
区域限高
height: 450px;
max-height: 450px;
overflow:auto; 滚动条
背景颜色
background: #E4E3E3;
字体颜色
color:#363030;