javascrip全选效果之学习笔记

 更新时间:2016年11月25日 15:03  点击:1553
我要做的效果就是当我们打开页面时就自动把所有checkbox选中,原理是:先获取所有type为\'input \'的元素,然后各全选的那个选项添加点击事件。如果全选项被经被选中,则通过循环使得每个元素的\'checked\'属性变为true,否则变成false.

document.getElementById(' ')是某个元素的id特性来获取某个指定的元素,返回的是一个对象。document.getElementById(' ') 是根据控件TAG(type属性)获取这个控件对象,返回的是一个对象数组;

要实现一个全选的效果,得先定义一组选项。

 代码如下 复制代码

<body>
 <p id="btn"><input id="hk" type="checkbox" />全选</p>
     <input type="checkbox"  /><br />
     <input type="checkbox"  /><br />
     <input type="checkbox"  /><br />
     <input type="checkbox"  /><br />
     <input type="checkbox"  /><br />
     <input type="checkbox"  /><br />
     <input type="checkbox"  /><br />
 </body>

接下利用Javascript来实现效果。教程中的效果是只能点全选时全部选中,如果再点全选就不能全部反选,这里我通过自己的理解,加入了这个功能

 代码如下 复制代码

<script type="text/javascript">   
 window.onload=function(){
    
     var oInput=document.getElementsByTagName('input')
     var ohk=document.getElementById('hk')
     ohk.onclick=function(){
         var i=0;
         if(ohk.checked==true){
         for(i=0;i<oInput.length;i++)
         {
             oInput[i].checked=true;
             }
         }
         else
         {
             for(i=0;i<oInput.length;i++)
         {
             oInput[i].checked=false;
            
         }
            
         }
     };
 };
 </script>

个人感觉此种方法还是有所欠缺,他会将页面中所有的类型为input的选中.现在我们写了一个利用点击事件来进行全选也反选效果。

 代码如下 复制代码

<meta charset="utf-8">
<script language="javascript">
function selectAll()
{
obj=document.getElementsByName('range');
for(var i=0;i<obj.length;i++)
{
 //document.form1.range[i].checked=true;
 obj.item(i).checked=true;
 
}
}
function unSelect()
{  
 obj=document.getElementsByName('range');
 for(var i=0;i<obj.length;i++)
 {
  if(obj.item(i).checked)
 {
  obj.item(i).checked=false;
 }
else
 {
  obj.item(i).checked=true;
 }
}
}
</script>
<form name="form1" >
<input type="checkbox" value="1" name="range">1<br>


<!--
<input type="checkbox" value="3" name="range">3<br>
<input type="checkbox" value="4" name="range">4<br>
<input type="checkbox" value="5" name="range">5<br> -->
<input type="button" value="全选" onclick="selectAll();">
<input type="button" value="反选" onclick="unSelect();">
</form>

这样如果结合php程序也实现删除功能我们只需要把获取的字符串以post或get方式提供就可以了,下面来看get方式提供。

 代码如下 复制代码

//批量删除   
//na 是name  
function checkSubmit(na,url)
{
 
    var str = '';
    for(var i=0;i < document.getElementsByName(na).length;i++)
    {
          if(document.getElementsByName(na)[i].checked){
            if(str=='') str += document.getElementsByName(na)[i].value;
            else str += ',' + document.getElementsByName(na)[i].value;
          }
    }
    if(str=='')
    {
        alert('你没选择任何内容!');
        return false;
    }
    else
    {
        location=url+"?id="+str+"&action=delall";
    }
}

在php程序中我们就要以

 代码如下 复制代码

$a = $_GET['id'];

然后利用where id in( $a ) 即可实现删除了哦,这也算是一简单php教程吧,有需要的朋友可学习交流。

本文章来给大家介绍php获取刚刚插入数据的ID值方法,php提供了mysql_insert_id()函数我们只要在插入数据后面加入echo mysql_insert_id() 即可。

例子

 代码如下 复制代码

<?php
//执行插入数据库的语句
//……
$getID=mysql_insert_id();//$getID即为最后一条记录的ID
 ?>

PHP 函数 mysql_insert_id() 是返回在最后一次执行了 INSERT 查询后,由 AUTO_INCREMENT 定义的字段的值。

还有一种方法

 代码如下 复制代码

msyql_query("select last_insert_id()");

last_insert_id() 是mysql 一个函数 也是 对当前链接起效
此用法 解决了 mysql_insert_id () 中遇到的 bigint 型问题

很多朋友问php中空数组怎么判断,下面我来给大家总结一些常用的判断空数组程序代码,有需要了解的朋友可进入参考。

empty函数,这个是判断数组值为空

 代码如下 复制代码

$arr= array("");
$result = empty($arr);
//$result = false
$arr = array();
$result = empty($arr);
//$result = true


implode();

用implode()将数组输出为字符串,判断输出的字串是否为空。初看上去似乎是个不错的方法,可惜跟上一点一样,对于二维以上数组就不行了。举个例子:

 代码如下 复制代码

$arr= array(array(),array(),array());

$str = implode(',',$arr);

if(empty($str)) echo "空";

else echo "非空";


array_filter函数

 代码如下 复制代码


<?php
$str1_array=array('一聚教程网','','http://www.111cn.net','','1654','');
$str1_array=array_filter($str1_array);
print_r($str1_array);
?>

结果

Array
(
[0] => 一聚教程网
[2] => http://www.111cn.net
[4] => 1654
)

count,size()函数

这两个函数是判断空数组的方法代码


$arr= array("");
echo count($arr);
echo size($arr);
//输出1

本文章来给大家介绍php5中的一个新东西,就是工厂模式了,这里是我常用工厂模式的一些学习笔记,下面与大家一同分享有需要了解的朋友可参考。

在大型系统中,许多代码依赖于少数几个关键类。需要更改这些类时,可能会出现困难。例如,假设您有一个从文件读取的 User 类。您希望将其更改为从数据库读取的其他类,但是,所有的代码都引用从文件读取的原始类。这时候,使用工厂模式会很方便。

工厂模式是一种类,它具有为您创建对象的某些方法。您可以使用工厂类创建对象,而不直接使用 new。这样,如果您想要更改所创建的对象类型,只需更改该工厂即可。使用该工厂的所有代码会自动更改。

示例1:显示工厂类的一个示列。

等式的服务器端包括两个部分:数据库和一组 PHP 页面,这些页面允许您添加反馈、请求反馈列表并获取与特定反馈相关的文章

 代码如下 复制代码

<?php
 interface IUser
 {
  function getName();
 }
 class User implements IUser
 {
  public function __construct( $id ) { }
  public function getName()
  {
   return "Jack";
  }
 }
 class UserFactory
 {
  public static function Create( $id )
  {
   return new User( $id );
  }
 }
 $uo = UserFactory::Create( 1 );
 echo( $uo->getName()."n" );
?>

IUser接口定义用户对象应执行什么操作。IUser 的实现称为 User,UserFactory 工厂类则创建 IUser 对象。此关系可以用图1中的UML 表示。


图 1. 工厂类及其相关 IUser 接口和用户类

  如果您使用 php 解释器在命令行上运行此代码,将得到如下结果:

% php factory1.php
Jack
%
 

测试代码会向工厂请求 User 对象,并输出 getName 方法的结果。

  有 一种工厂模式的变体使用工厂方法。类中的这些公共静态方法构造该类型的对象。如果创建此类型的对象非常重要,此方法非常有用。例如,假设您需要先创建对 象,然后设置许多属性。此版本的工厂模式会将该进程封装在单个位置中,这样,不用复制复杂的初始化代码,也不必将复制好的代码在在代码库中到处粘贴。

示例2 显示使用工厂方法的一个示例。

 代码如下 复制代码

<?php
interface IUser
{
  function getName();
}
class User implements IUser
{
  public static function Load( $id )
  {
        return new User( $id );
  }
  public static function Create( )
  {
        return new User( null );
  }
  public function __construct( $id ) { }
  public function getName()
  {
    return "Jack";
  }
}
$uo = User::Load( 1 );
echo( $uo->getName()."n" );
?>


好了上面讲了很多了, 下面我来来看个实例

我们建立以下四个文件

index.php

 代码如下 复制代码

<?php
include_once("f.inc.php");
$f=new factory;
$t1=&$f->create('T1');
echo $t1->getName();
echo $config;
?>

f.inc.php

 代码如下 复制代码

<?php
class factory
{
 function factory()
 {
  $this->mClasses=array('T1'=>'t1.inc.php','T2'=>'t2.inc.php');
 }
 function &create($class)
 {
  if (!class_exists($class))
  {
   require_once($this->mClasses[$class]);
  }
  return new $class;
 }
}
?>

t1.inc.php

 代码如下 复制代码

<?php
global $config;
$config='surfchen';
class T1
{
 var $mName='name::T1';
 function getName()
 {
  return $this->mName;
 }
}
?>

t2.inc.php

 代码如下 复制代码

<?php
class T2
{
 function T2()
 {
  echo 't2 is ok';
 }
}
?>

在index.php里,我们通过一个factory类来创建其他的类实例。
在factory里,保存有一个数组$this->mClasses,格式为array(“类名”=>”类文件路径”).
我们通过factory::create()来创建一个类实例的时候,在create()里,会首先检测类是否存在,如果不存在,就根据$this->mClasses把类对应的类文件包含进来。然后创建并返回一个该类的实例。

这样,我们只需要把factory类文件包含进执行的脚本(如index.php)中就可以了。

大家可能还注意到了在t1.inc.php中的这两行代码。

 代码如下 复制代码
global $config;
$config='surfchen';

为什么需要global呢?因为t1.inc.php是在factory::create中被包含的,t1文件中的变量将会默认为create的函数级变量。所以我们需要对其中的变量(如$config)进行global以便index.php能访问到。

运行index.php,将会输出

 代码如下 复制代码
name::T1surfchen
本文章来给大家简单的介绍一下关于PHP 全局变量 Global关键字引用介绍,虽说评论跟文章相比,及其的简短,但原理却阐述的很明白,而且浅显易懂,尤其是对于有一些语言基础的人来说,是值得总结的。不卖关子,开始正题:

引用PHP手册的$GLOBALS的解释:

Global 变量:$GLOBALS
注意: $GLOBALS 在 PHP 3.0.0 及以后版本中适用。

由所有已定义全局变量组成的数组。变量名就是该数组的索引。

这是一个“superglobal”,或者可以描述为自动全局变量。
也就是说上面代码中的$var1和$GLOBALS['var1']是指的同一变量,而不是2个不同的变量!

全局变量举例

 代码如下 复制代码

<?php
 $pangbu = "pangbu";
 
 function demo (){
 
  global $pangbu;
 
  echo $pangbu;
 }
 
 demo();
?>

解释

其实global $pangbu ;是$pangbu = &$_GLOBAL['pangbu ']的简写,

意思是$pangbu 是$_GLOBAL['pangbu ']的一个引用,至于引用怎么用,$pangbu 就怎么用了。
自己的一些笔记
之前一直没有搞明白 global 的用法 ,虽然会用但却一直在朦朦胧胧中糊里糊涂的,现在终于搞明白了。
.

为了了解更多Global的应用,请看下面php案例:

 代码如下 复制代码
<?php
    $url = "www.111cn.net";
    function get_url(){
     echo "The blog is".$url; //这里获取不到$url,因为它只是一个未定义的局部变量
    }
    get_url();
?>

 
上面的例子会报notice错误!

 代码如下 复制代码
<?php
 $url = "www.111cn.net";
 function get_url(){
  global $url;
  echo "The blog url is ".$url;
 }
 get_url();
?>

 
上面这样用法就是对的,在函数中声明全局变量后,任何变量的所有引用变量都会指向到全局变量!

另外有必要说一下,全局数组$GLOBALS[],用上面的例子改写下就是这样:

 代码如下 复制代码
<?php
 $url = "www.111cn.net";
 function get_url(){
  echo "The blog url is ".$GLOBALS['url'];
 }
 get_url();
?>
 

注意global声明变量不能复制,如 global $url = "www.111cn.net";  这样是错误的

[!--infotagslink--]

相关文章

  • 关于JavaScript中name的意义冲突示例介绍

    在昨天的《Javascript权威指南》学习笔记之十:ECMAScript 5 增强的对象模型一文中,对于一段代码的调试出现了一个奇怪现象,现将源代码贴在下面: 复制代码 代码如下: <script type="text/javascript"> function Person(){}...2014-05-31
  • javascript自定义的addClass()方法

    复制代码 代码如下: //element:需要添加新样式的元素,value:新的样式 function addClass(element, value ){ if (!element.className){ element.className = value; }else { newClassName = element.className; newClas...2014-05-31
  • JavaScript中的this关键字使用方法总结

    在javascritp中,不一定只有对象方法的上下文中才有this, 全局函数调用和其他的几种不同的上下文中也有this指代。 它可以是全局对象、当前对象或者任意对象,这完全取决于函数的调用方式。JavaScript 中函数的调用有以下...2015-03-15
  • JavaScript中逗号运算符介绍及使用示例

    有一道js面试题,题目是这样的:下列代码的执行结果是什么,为什么? 复制代码 代码如下: var i, j, k; for (i=0, j=0; i<10, j<6; i++, j++) { k = i+j; } document.write(k); 答案是显示10,这道题主要考察JavaScript的逗...2015-03-15
  • javascript的事件触发器介绍的实现

    事件触发器从字面意思上可以很好的理解,就是用来触发事件的,但是有些没有用过的朋友可能就会迷惑了,事件不是通常都由用户在页面上的实际操作来触发的吗?这个观点不完全正确,因为有些事件必须由程序来实现,如自定义事件,jQue...2014-06-07
  • ActiveX控件与Javascript之间的交互示例

    1、ActiveX向Javascript传参 复制代码 代码如下: <script language="javascript" for="objectname" event="fun1(arg)"> fun2(arg); </script> objectname为ActiveX控件名,通过<object>标签里的id属性设定,如下; 复制...2014-06-07
  • 详解JavaScript操作HTML DOM的基本方式

    通过 HTML DOM,可访问 JavaScript HTML 文档的所有元素。 HTML DOM (文档对象模型) 当网页被加载时,浏览器会创建页面的文档对象模型(Document Object Model)。 HTML DOM 模型被构造为对象的树: 通过可编程的对象模型,Java...2015-10-23
  • JavaScript获取浏览器信息的方法

    Window有navigator对象让我们得知浏览器的全部信息.我们可以利用一系列的API函数得知浏览器的信息.JavaScript代码如下:function message(){ txt = "<p>浏览器代码名: " + navigator.appCodeName + "</p>";txt+= "<p>...2015-11-24
  • 跟我学习javascript的最新标准ES6

    虽然ES6都还没真正发布,但已经有用ES6重写的程序了,各种关于ES789的提议已经开始了,这你敢信。潮流不是我等大众所能追赶的。潮流虽然太快,但我们不停下学习的步伐,就不会被潮流丢下的,下面来领略下ES6中新特性,一堵新生代JS...2015-11-24
  • JavaScript操作URL的相关内容集锦

    ---恢复内容开始---1.location.href.....(1)self.loction.href="http://www.cnblogs.com/url" window.location.href="http://www.cnblogs.com/url" 以上两个用法相同均为在当前页面打开URL页面 (2)this.locati...2015-10-30
  • javascript实现tab切换的四种方法

    tab切换在网页中很常见,故最近总结了4种实现方法。 首先,写出tab的框架,加上最简单的样式,代码如下: <!DOCTYPE html> <html> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><style> *{ pa...2015-11-08
  • 基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式

    前言在面向对象的编程范式中,封装都是必不可少的一个概念,而在诸如 Java,C++等传统的面向对象的语言中, 私有成员是实现封装的一个重要途径。但在 JavaScript 中,确没有在语法特性上对私有成员提供支持, 这也使得开发人员使...2015-10-30
  • javascript实现数独解法

    生生把写过的java版改成javascript版,第一次写,很不专业,见谅。唉,我是有多闲。复制代码 代码如下: var Sudoku = { init: function (str) { this.blank = []; this.fixed = []; this.cell =...2015-03-15
  • javascript中slice(),splice(),split(),substring(),substr()使用方法

    1.slice();Array和String对象都有在Array中 slice(i,[j])i为开始截取的索引值,负数代表从末尾算起的索引值,-1为倒数第一个元素 j为结束的索引值,缺省时则获取从i到末尾的所有元素参数返回: 返回索引值从i到j的数组,原数组...2015-03-15
  • javascript中的document.open()方法使用介绍

    document.open()方法打开一个新的文档,并用document.write()方法编写文档的内容,然后用document.close()方法关闭文档操作,使其内容显示出来。 例如: 复制代码 代码如下: <script type="text/javascript"> window.onloa...2013-10-13
  • javascript如何实现暂停功能

    本文实例讲述了JS实现的自定义网页拖动类。分享给大家供大家参考,具体如下: Javascript本身没有暂停功能(sleep不能使用)同时 vbscript也不能使用doEvents,故编写此函数实现此功能。 javascript作为弱对象语言,一个函数也...2015-11-08
  • JavaScript多并发问题如何处理

    经常在写代码的时候碰到这样的场景:页面初始化时显示loading页,同时启动多个ajax并发请求获取数据,当每个ajax请求返回时结束loading。 举个例子,一个下订单的页面,要查询常用地址信息、商品信息、地市信息…而这些请求都...2015-10-30
  • JavaScript制作淘宝星级评分效果的思路

    小编也是刚开始学JavaScript,觉得淘宝评星效果很棒,于是产生了自己写一个的想法,先给大家分享一下实现效果:现附上自己写的源代码 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <script language="Java...2015-11-24
  • 开启Javascript中apply、call、bind的用法之旅模式

    我希望能够通过这篇文章,能够清晰的提升对apply、call、bind的认识,并且列出一些它们的妙用加深记忆。 apply、call 在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为...2015-10-30
  • javascript移动设备Web开发中对touch事件的封装实例

    在触屏设备上,一些比较基础的手势都需要通过对 touch 事件进行二次封装才能实现。zepto 是移动端上使用率比较高的一个类库,但是其 touch 模块模拟出来的一些事件存在一些兼容性问题,如 tap 事件在某些安卓设备上存在事...2014-06-07