评论 - lizhenqiu blog

#¹¹⁰³

作者：广西南宁市

<style>
    .next_button{
        cursor:pointer
    }
</style>
<div class="button">
    <div class=" next_button button_left btn_red" style="width: 345px;">
    下一步
    </div>
</div>
<script>
$(document).on("click",".next_button",function(){
    alert();
});
</script>

Run code

Cut to clipboard

#,广西南宁市,2017-08-10,10:42:41, 正解，其实安卓和ios里面还有些不兼容的状态
使用苹果手机访问的时候，发现了一个坑爹的问题，如论如何点击“下一步”，都没有任何反应，可是在安卓和各种模拟器中一切正常。后来经过查找资料才知道，苹果有这么个设置：
对于点击的对象，拥有cursor:pointer这个样式的设置，也就是说，鼠标放上去，能够出现“手”型的图标才被认作可以使用点击事件，

#,广西南宁市,2017-08-10,10:46:31, 动态生成元素的点击事件

$(document).on("click",function(){})

Run code

Cut to clipboard

在andriod设备和电脑浏览器模拟上可以触发，而在apple移动设备上却无法触发。

试过很多办法，在元素生成后再绑定事件，把click改成touch事件，都没有用，最后好不容易百度到了解决办法
解决的方法很巧妙，就是给需要绑定事件的元素添加一个css

cursor: pointer

Run code

Cut to clipboard

selector {
  cursor:pointer
}

Run code

Cut to clipboard

文章：on click事件在移动端点击无效bug 发表时间：2017-08-10, 10:41:49

展开↯

#¹¹⁰⁴

作者：广西南宁市

<script>
   $(selector).click(function(){console.log(‘1111‘)})
</script>

Run code

Cut to clipboard

文章：on click事件在移动端点击无效bug 发表时间：2017-08-10, 10:44:44

展开↯

#¹¹⁰⁵

作者：广西南宁市

将click换成touchstart（在移动端基本都用吧）

 <script>
    $(document).on("touchstart",function(){console.log(‘22222‘)})
 </script>

Run code

Cut to clipboard

文章：on click事件在移动端点击无效bug 发表时间：2017-08-10, 10:43:32

展开↯

#¹¹⁰⁶

作者：广西南宁市

JS 如何获取和监听屏幕方向的改变？
大概写一下：
方法一：用触发手机的横屏和竖屏之间的切换的事件

window.addEventListener("orientationchange", function() { 
// 宣布新方向的数值 
alert(window.orientation); 
}, false);

Run code

Cut to clipboard

方法二：监听调整大小的改变

window.addEventListener("resize", function() { 
// 得到屏幕尺寸 (内部/外部宽度，内部/外部高度) 
}, false);

Run code

Cut to clipboard

css判断横竖屏幕

@media screen and (orientation:portrait) { 
/* portrait-specific styles */ 
} 
/* landscape */ 
@media screen and (orientation:landscape) { 
/* landscape-specific styles */ 
}

Run code

Cut to clipboard

本地window.matchMedia方法允许实时媒体查询。我们可以利用以上媒体查询找到我们是处于直立或水平视角：

var mql = window.matchMedia("(orientation: portrait)"); 
// 如果有匹配，则我们处于垂直视角 
if(mql.matches) { 
// 直立方向 
alert("1") 
} else { 
//水平方向 
alert("2") 
} 
// 添加一个媒体查询改变监听者 
mql.addListener(function(m) { 
if(m.matches) { 
// 改变到直立方向 
document.getElementById("test").innerHTML="改变到直立方向"; 
} 
else { 
document.getElementById("test").innerHTML="改变到水平方向"; 
// 改变到水平方向 
} 
});

Run code

Cut to clipboard

文章：$(window) $(document) 区别发表时间：2017-08-10, 10:35:46

展开↯

#¹¹⁰⁷

作者：广西南宁市

用JS或者jQuery可以监听浏览器窗口的变化吗 5
我要的效果是这样的：当浏览器窗口大小变化时（缩小或者放大浏览器窗口），能够实时获取当前浏览器窗口的宽度和高度。我说的实时指不用刷新当前页面，当浏览器窗口大小改变时就触发事件。
试试resize事件

$(window).resize(function() {
    var width = $(this).width();
    var height = $(this).height();
});

Run code

Cut to clipboard

不过resize事件好像对框架不起作用

#,广西南宁市,2017-08-10,10:34:25, 方法一：在标签上加入 onLoad="" onResize="" 方法写上对应的方法即可
方法二：window.onresize=function(){///.....} 在方法里面写上对应的代码即可
着两种方法基本都可以解决你的问题了

文章：$(window) $(document) 区别发表时间：2017-08-10, 10:33:47

展开↯

#¹¹⁰⁸

作者：广西南宁市

$(document).ready()于$(window).load()的区别。
1.执行时间不同：
从字面的意思上理解，$(document).ready()就是文档准备好了。也就是浏览器已经解析完整个html文档，dom树已经建立起来了，这时就可以通过class属性或者id属性等等对dom进行操作等。而$(window).load()就是整个页面已经加载完毕。与前者的区别是dom树虽然已经建立起来了，但页面不一定加载完毕，如一些大的图片等，加载完成就需要一定的时间；但是页面加载完毕后，dom肯定也就建立起来了；但是有些文字或者图片链接等需要在文档加载完毕前，dom树建立后就进行的，这时就要用到$(document).ready()了。
2.可以被执行的次数不同：
$(document).ready()可以在JavaScript代码中出现多次，并且里面的函数或者代码都可以得到执行；而$(window).load()只能在JavaScript代码中出现一次，如果有多个$(window).load()，那么只有最后一个$(window).load()里面的函数或者代码才会执行，之前的$(window).load()都将被覆盖;

<script>
$(document).ready(function(){
alert("test1");//这段代码会被执行
});
$(document).ready(function(){
alert("test2");//这段代码会被执行
});
$(window).load(function(){
alert("test1");//这段代码不会被执行
});
$(window).load(function(){
alert("test2");//这段代码将被执行
});
</script>

Run code

Cut to clipboard

3.执行的效率不同：
如要在dom的元素节点中添加onclick属性节点，这时用$(document).ready()就要比用$(window).load()的效率高；但是在某些时候还必须得用$(window).load()才行，如之前写的app下载，如果要关闭这个下载框，则必须要在整个下载框加载完毕后，才能点击关闭图标，对app下载框执行隐藏。

<script>
$(document).ready(function(){
$(".the_body a").attr("onclick","alert('test')");
});
$(window).load(function(){
$(".close_btn").click(function(){
$("#app_down").hide();
});
});
</script>

Run code

Cut to clipboard

文章：$(window) $(document) 区别发表时间：2017-08-10, 10:32:07

展开↯

#¹¹⁰⁹

作者：广西南宁市

$(document) 是当前文档，就是你看到的整个网页
$(window) 如果没有框架则就是你浏览的当前浏览器的窗口

$(document).ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数，因为它可以极大地提高web应用程序的响应速度

首先我解释一下jQuery jQuery有一个用来作为DOM快速载入javascript的得心应手的小函数，那就是ready… 他在页面加载完成之前执行。
为什么不用window.onload()，因为window.onload函数执行的时候，要说明所有东西已经载入，包括图像和横幅等等。要知道较大的图片下载速度会比较慢，因此用户必须等待大图片下载完毕才能看到window.onload()执行的代码效果，这样就花费了很长的等待时间，这不是我们想要的。
但是 $(document).ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
这是事件模块中最重要的一个函数，因为它可以极大地提高web应用程序的响应速度。
简单地说，这个方法纯粹是对向window.load事件注册事件的替代方法。通过使用这个方法，可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数. $(document).ready(function(){ // 你的代码 });
$(document)意思是说，获取整个网页文档对象（类似的于window.document），

$(document).ready意思就是说，获取文档对象就绪的时候。上面这段代码的意思是检查文档对象直到它能够允许被操作

文章：$(window) $(document) 区别发表时间：2017-08-10, 10:30:58

展开↯

#¹¹¹⁰

作者：广西南宁市

首先
$(document)这个是获取文档对象
$(window)这个是获取窗口对象，也就是浏览器客户区
给大家举个例子就非常直接明了了

$(document).height()
$(window).height()

Run code

Cut to clipboard

注意，让网页有滚动条
然后输出一下这两个值得大小，你就知道什么区别了

文章：$(window) $(document) 区别发表时间：2017-08-10, 10:18:14

展开↯

#¹¹¹¹

作者：广西南宁市

(document).height()与$(window).height()

jQuery(window).height()代表了当前可见区域的大小，而jQuery(document).height()则代表了整个文档的高度，可视具体情况使用.

注意当浏览器窗口大小改变时(如最大化或拉大窗口后) jQuery(window).height() 随之改变，但是jQuery(document).height()是不变的。

$(document).scrollTop() 获取垂直滚动的距离即当前滚动的地方的窗口顶端到整个页面顶端的距离
$(document).scrollLeft() 这是获取水平滚动条的距离

要获取顶端只需要获取到scrollTop()==0的时候就是顶端了

要获取底端只要获取

scrollTop()>=$(document).height()-$(window).height()

Run code

Cut to clipboard

就可以知道已经滚动到底端了

$(document).height()  //是获取整个页面的高度
$(window).height()  //是获取当前 也就是你浏览器所能看到的页面的那部分的高度  这个大小在你缩放浏览器窗口大小时 会改变 与document是不一样的  根据英文应该也能理解吧

Run code

Cut to clipboard

自己做个实验就知道了

$(document).scroll(function(){
    $("#lb").text($(document).scrollTop());
})
<span id="lb" style="top:100px;left:100px;position:fixed;"></span><!--一个固定的span标记 滚动时方便查看-->

Run code

Cut to clipboard

#,广西南宁市,2017-08-10,10:17:18, 不错！简洁有力。但是要获取底端只要获取scrollTop()>=$(document).height()-$(window).height() 就可以知道已经滚动到底端了可以只判断scrollTop()=$(document).height()-$(window).height()吗？小于是什么情况会出现？

文章：$(window) $(document) 区别发表时间：2017-08-10, 10:16:55

展开↯

#¹¹¹²

作者：广西南宁市

Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法，不过与window.onload方法还是有区别的。
1.执行时间
window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
$(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。
2.编写个数不同
window.onload不能同时编写多个，如果有多个window.onload方法，只会执行一个
$(document).ready()可以同时编写多个，并且都可以得到执行
3.简化写法
window.onload没有简化写法
$(document).ready(function(){})可以简写成$(function(){});

文章：$(window) $(document) 区别发表时间：2017-08-10, 10:12:35

展开↯

#¹¹¹³

作者：北京市

有一段和《两个只能活一个》共用的配乐。和《放逐》《复仇》组成三部曲，标题就叫《任达华叫黄秋生去杀黄秋生不想杀的三个人》。

文章：那些质量很高却冷门的电影发表时间：2017-08-10, 01:32:14

展开↯

#¹¹¹⁴

作者：北京市

手机表情点不了，手机屏蔽广告提示？

文章：@意见反馈/技术支持/伊网/安企网发表时间：2017-08-09, 22:32:34

展开↯

#¹¹¹⁵

作者：广西南宁市

去掉边框：

border: 0; background: transparent;

Run code

Cut to clipboard

去掉小三角：

appearance:none;
-moz-appearance:none; /* Firefox */
-webkit-appearance:none; /* Safari 和 Chrome */

Run code

Cut to clipboard

#,广西南宁市,2017-08-09,16:49:49, 去掉select三角下拉选项三角形

文章：巧用边框设置一些效果发表时间：2017-08-09, 16:48:53

展开↯

#¹¹¹⁶

作者：广西南宁市

<?php
echo count('abcd');//1
echo count('“abcd”');//1
echo strlen("abcd");//4
echo strlen('abcd');//4
echo strlen('“abcd”');//10

Run code

Cut to clipboard

文章：PHP中常见的面试题(附答案) 发表时间：2017-08-09, 10:44:12

展开↯

#¹¹¹⁷

作者：广西南宁市

#,广西南宁市,2017-08-08,15:50:30,

文章：常用html、demo代码发表时间：2017-08-08, 15:50:01

展开↯

#¹¹¹⁸

作者：广西南宁市

php数组按指定的KEY排序

function array_sort($arr,$keys,$orderby='asc'){ 

    $keysvalue = $new_array = array();

    foreach ($arr as $k=>$v){
        $keysvalue[$k] = $v[$keys];
    }

    //对key集合排序
    if($orderby== 'asc'){
        asort($keysvalue);
    }else{
        arsort($keysvalue);
    } 

    reset($keysvalue);

    //根据排序好的key按顺序从原数组中获取对应的值
    foreach ($keysvalue as $k=>$v){
        $new_array[] = $arr[$k];
    }
    return $new_array; 
}

Run code

Cut to clipboard

文章：js生成随机数(指定范围)的代码发表时间：2017-08-08, 10:53:29

展开↯

#¹¹¹⁹

作者：广西南宁市

php生成不重复随机数

<?php
/*
* array unique_rand( int $min, int $max, int $num )
* 生成一定数量的不重复随机数
* $min 和 $max: 指定随机数的范围
* $num: 指定生成数量
*/
function unique_rand($min, $max, $num) {
    $count = 0;
    $return = array();
    while ($count < $num) {
        $return[] = mt_rand($min, $max);
        $return = array_flip(array_flip($return));
        $count = count($return);
    }
    shuffle($return);
    return $return;
}

$arr = unique_rand(1, 25, 16);
sort($arr);

$result = '';
for($i=0; $i < count($arr);$i++)
{
	$result .= $arr[$i].',';
}
$result = substr($result, 0, -1);
echo $result;
?>

Run code

Cut to clipboard

文章：js生成随机数(指定范围)的代码发表时间：2017-08-08, 10:52:56

展开↯

#¹¹²⁰

作者：广西南宁市

手机版网页阻止屏幕滑动

//阻止屏幕滑动
$('html,body').on(touchmove,function(e){
    e.preventDefault()
});

Run code

Cut to clipboard

#,广西南宁市,2017-08-08,10:51:50, 给以某网站域名链接开头的a标签、超链接添加图标logo

#main #content a[href^="https://lizhenqiu.com"]{
	letter-spacing:0;
	font-size: 14px;
	padding:3px 0 3px 27px;
	background:url(images/url_yuncode_icon.png) no-repeat -155px -329px;
}

Run code

Cut to clipboard

文章：为iframe添加onclick事件发表时间：2017-08-08, 10:48:24

展开↯

#¹¹²¹

作者：广西南宁市

jquery方式判断checkbox是否选中（.is(":checked")）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>1-6-1</title>
<!-- 引入 jQuery -->
<script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>
<script type="text/javascript">
//等待dom元素加载完毕.
$(document).ready(function(){
	var $cr = $("#cr");  //jQuery对象
	$cr.click(function(){
		if($cr.is(":checked")){ //jQuery方式判断
			alert("感谢你的支持!你可以继续操作！");
		}
	})
});
</script>
</head>
<body>
<input type="checkbox" id="cr"/><label for="cr">我已经阅读了上面制度.</label>
</body>
</html>

Run code

Cut to clipboard

文章：为iframe添加onclick事件发表时间：2017-08-08, 10:47:23

展开↯

Records:2796 59/148 «‹55 56 57 58 59 60 61 62 63 ›»