jQuery设置与获取HTML,文本和值的简单实例

代码如下:

<script type="text/javascript">
 //<![CDATA[
  $(function(){
      //获取<p>元素的HTML代码
      $("input:eq(0)").click(function(){
            alert(  $("p").html() );
      });
      //获取<p>元素的文本
      $("input:eq(1)").click(function(){
            alert(  $("p").text() );
      });
      //设置<p>元素的HTML代码
      $("input:eq(2)").click(function(){
             $("p").html("<strong>你最喜欢的水果是?</strong>");
      });   
       //设置<p>元素的文本
      $("input:eq(3)").click(function(){
             $("p").text("你最喜欢的水果是?");
      }); 
      //设置<p>元素的文本
      $("input:eq(4)").click(function(){
             $("p").text("<strong>你最喜欢的水果是?</strong>");
      }); 
      //获取按钮的value值
      $("input:eq(5)").click(function(){
             alert( $(this).val() );
      });  
      //设置按钮的value值
      $("input:eq(6)").click(function(){
            $(this).val("我被点击了!");
      }); 
  });
  //]]>
  </script>

代码如下:

<script type="text/javascript">
 //<![CDATA[
  $(function(){
      $("#address").focus(function(){         // 地址框获得鼠标焦点
            var txt_value =  $(this).val();   // 得到当前文本框的值
            if(txt_value=="请输入邮箱地址"){ 
                $(this).val("");              // 如果符合条件,则清空文本框内容
            }
      });
      $("#address").blur(function(){          // 地址框失去鼠标焦点
              var txt_value =  $(this).val();   // 得到当前文本框的值
            if(txt_value==""){
                $(this).val("请输入邮箱地址");// 如果符合条件,则设置内容
            }
      })

$("#password").focus(function(){
            var txt_value =  $(this).val();
            if(txt_value=="请输入邮箱密码"){
                $(this).val("");
            }
      });
      $("#password").blur(function(){
              var txt_value =  $(this).val();
            if(txt_value==""){
                $(this).val("请输入邮箱密码");
            }
      })
  });
  //]]>
  </script>

代码如下:

<script type="text/javascript">
 //<![CDATA[
  $(function(){
      $("#address").focus(function(){         // 地址框获得鼠标焦点
            var txt_value =  $(this).val();   // 得到当前文本框的值
            if(txt_value==this.defaultValue){ 
                $(this).val("");              // 如果符合条件,则清空文本框内容
            }
      });
      $("#address").blur(function(){          // 地址框失去鼠标焦点
              var txt_value =  $(this).val();   // 得到当前文本框的值
            if(txt_value==""){
                $(this).val(this.defaultValue);// 如果符合条件,则设置内容
            }
      })

$("#password").focus(function(){
            var txt_value =  $(this).val();
            if(txt_value==this.defaultValue){
                $(this).val("");
            }
      });
      $("#password").blur(function(){
              var txt_value =  $(this).val();
            if(txt_value==""){
                $(this).val(this.defaultValue);
            }
      })
  });
  //]]>
  </script>

代码如下:

<script type="text/javascript">
 //<![CDATA[
  $(function(){
      //设置单选下拉框选中
      $("input:eq(0)").click(function(){
            $("#single").val("2");
      });
      //设置多选下拉框选中
      $("input:eq(1)").click(function(){
            $("#multiple").val(["选择2号", "选择3号"]);
      });
      //设置单选框和多选框选中
      $("input:eq(2)").click(function(){
             $(":checkbox").val(["check2","check3"]);
            $(":radio").val(["radio2"]);
      });

});
  //]]>
  </script>

代码如下:

<script type="text/javascript">
 //<![CDATA[
  $(function(){
      //设置单选下拉框选中
      $("input:eq(0)").click(function(){
            $("#single option").removeAttr("selected");  //移除属性selected
            $("#single option:eq(1)").attr("selected",true); //设置属性selected
      });
      //设置多选下拉框选中
      $("input:eq(1)").click(function(){
            $("#multiple option").removeAttr("selected");  //移除属性selected
            $("#multiple option:eq(2)").attr("selected",true);//设置属性selected
            $("#multiple option:eq(3)").attr("selected",true);//设置属性selected
      });
      //设置单选框和多选框选中
      $("input:eq(2)").click(function(){
            $(":checkbox").removeAttr("checked"); //移除属性checked
            $(":radio").removeAttr("checked"); //移除属性checked
            $(":checkbox[value=check2]").attr("checked",true);//设置属性checked
            $("[value=check3]:checkbox").attr("checked",true);//设置属性checked
            $("[value=radio2]:radio").attr("checked",true);//设置属性checked
      });  
  });
  //]]>
  </script>

:checkbox 表示属性为checkbox

(0)

相关推荐

  • jQuery设置与获取HTML,文本和值的简单实例

    复制代码 代码如下: <script type="text/javascript"> //<![CDATA[  $(function(){      //获取<p>元素的HTML代码      $("input:eq(0)").click(function(){            alert(  $("p").html() );      });      //获取<p>元素的文本      $(&q

  • jquery获取img的src值的简单实例

    简简单单的一句话,如下: <img id="test" src="1.jpg" alt="test" /> 引用的jquery如下: <script type="text/javascript" language="javascript" src="~/Js/jquery-1.2.6.js"></script> <script type=&quo

  • checkbox批量选中,获取选中项的值的简单实例

    checkbox批量选中,获取选中项的值的简单实例 <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="jquery.js"></script&g

  • js获取所有checkbox的值的简单实例

    例: <input type="checkbox" name="test" value="值1" />显示的内容 <input type="checkbox" name="test" value="值2" />显示的内容 <input type="checkbox" name="test" value="值3

  • jQuery设置和移除文本框默认值的方法

    本文实例讲述了jQuery设置和移除文本框默认值的方法.分享给大家供大家参考.具体分析如下: 开始时,文本框设定一个默认值.当光标移动到文本框时,如果文本框当前值是默认值,那么清空:离开文本框时,文本框值如果为空,那么将文本框值设置为默认值. 代码如下: $(document).ready(function() { //each遍历文本框 $(".input").each(function() { //保存当前文本框的值 var vdefault = this.value; $(thi

  • jquery获取form表单input元素值的简单实例

    一般取值方法 $("#id").val(); $("#id").attr("value"); //其中value是元素的属性名如<s:textfield  id="cifName" key="cifName"   name="#request.consBean.cifName" />的id,key,name属性.取到的值是属性后对应双引号里面的字符. function sav

  • jquery获取复选框的值的简单实例

    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <mce:style><!-- --></mce:style><style mce_bogus="1"> </style>

  • 使用jquery获取url及url参数的简单实例

    使用jquery获取url以及使用jquery获取url参数是我们经常要用到的操作 1.jquery获取url很简单,代码如下: window.location.href; 其实只是用到了javascript的基础的window对象,并没有用jquery的知识. 2.jquery获取url参数比较复杂,要用到正则表达式,所以学好javascript正则式多么重要的事情 首先看看单纯的通过javascript是如何来获取url中的某个参数: //获取url中的参数 function getUrlP

  • jQuery EasyUI 为Combo,Combobox添加清除值功能的实例

    效果图: 图标 (function($){ //初始化清除按钮 function initClear(target){ var jq = $(target); var opts = jq.data('combo').options; var combo = jq.data('combo').combo; var arrow = combo.find('span.combo-arrow'); var clear = arrow.siblings("span.combo-clear");

  • jquery设置表单元素为不可用的简单代码

    本章节通过简单的实例代码介绍一下如何将表单元素设置为不可用状态. 代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.jb51.net/" /> <title>我们</title> <script type=

随机推荐