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

 本篇文章主要是对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
 

时间: 2025-01-29 14:05:03

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

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

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

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

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的值的简单实例_javascript技巧

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

jquery获取img的src值的简单实例_javascript技巧

简简单单的一句话,如下: <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

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

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

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

 这篇文章主要介绍了jQuery设置和移除文本框默认值的方法,实例分析了jQuery操作文本框的技巧,具有一定参考借鉴价值,需要的朋友可以参考下     本文实例讲述了jQuery设置和移除文本框默认值的方法.分享给大家供大家参考.具体分析如下: 开始时,文本框设定一个默认值.当光标移动到文本框时,如果文本框当前值是默认值,那么清空:离开文本框时,文本框值如果为空,那么将文本框值设置为默认值. 代码如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 1

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

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

JS获取文本框,下拉框,单选框的值的简单实例

 本篇文章主要是对JS获取文本框,下拉框,单选框值的简单实例进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 1.文本框   1.1 <input type="text" name="test" id="test">   通过var t=document.getElementById("test").value把值赋给变量t,   1.2 当然也可以反过来把已知的变量值赋给文本框,例如:   var m =

jquery multiselect 怎么获取选中的value值

问题描述 jquery multiselect 怎么获取选中的value值 <select class="form-control" name="productIds" id="addPageSelect" multiple="multiple" > #foreach($category in ${webChanel}) <option value="$category.id">${