zoukankan      html  css  js  c++  java
  • input框获取焦点和失去焦点,select框change事件

    转载:http://www.cnblogs.com/weeky/archive/2012/04/08/2438002.html

    以下可以直接调用,注意:jQuery引用用的Google.js》

     1 <html xmlns="http://www.w3.org/1999/xhtml">
     2 <head>
     3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     4 <title>input失去焦点和获得焦点jquery焦点事件插件 - 懒人建站</title>
     5 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
     6 <script type="text/javascript">
     7 $(document).ready(function(){
     8 //focusblur
     9     jQuery.focusblur = function(focusid) {
    10 var focusblurid = $(focusid);
    11 var defval = focusblurid.val();
    12         focusblurid.focus(function(){
    13 var thisval = $(this).val();
    14 if(thisval==defval){
    15                 $(this).val("");
    16             }
    17         });
    18         focusblurid.blur(function(){
    19 var thisval = $(this).val();
    20 if(thisval==""){
    21                 $(this).val(defval);
    22             }
    23         });
    24         
    25     };
    26 /*下面是调用方法*/
    27     $.focusblur("#searchkey");
    28 });
    29 </script>
    30 </head>
    31 
    32 <body>
    33 <form action="" method="post">
    34 <input name="" type="text" value="输入搜索关键词" id="searchkey"/>
    35 <input name="" type="submit" id="searchbtn" value="搜索"/>
    36 </form>
    37 <p>input失去焦点和获得焦点jquery焦点事件插件,<br/><strong style="color:#F00">鼠标在搜索框中点击的时候里面的文字就消失了</strong>。</p>
    38 
    39 </body>
    40 </html>

    select 中option的change事件:

    1    $("#CSS_Font_Style").change(function(){ 
    2                 changeEvent();
    3                 }) 

    获取input的内容:

    1 var CSS_Border_Width = $("#CSS_Border_Width").val();

    获取option的内容:

    1 var CSS_Font_Style = $("#CSS_Font_Style").find("option:selected").text();

    jQuery动态设置css属性:

     1  <div id = "divcss"> 
    $(".divcss").css({
     2                 "border-width":CSS_Border_Width+"px",
     3                 "background-color":CSS_Background_Color,
     4                 "background-position":CSS_Background_Position,
     5                 "background-size":CSS_Background_Size,
     6                 "border-color":CSS_Border_Color,
     7                 "background-image":CSS_Background_Image,
     8                 "font-weight":CSS_Font_Weight,
     9                 "font-size":CSS_Font_Size,
    10                 "line-height":CSS_Font_Line_Height,
    11                 "font-family":CSS_Font_Family,
    12                 "font-variant":CSS_Font_Variant,
    13                 "border-style":CSS_Border_Style,
    14                 "background-repeat":CSS_Background_Repeat,
    15                 "background-origin":CSS_Background_Origin,
    16                 "background-attachment":CSS_Background_Attachment,
    17                 "font-style":CSS_Font_Style,
    18             })
  • 相关阅读:
    JavaScript基础1
    iOS开发之Quzrtz2D 一:认识Quzrtz2D
    ios开发抽屉效果的封装使用
    ios开发手势处理之手势识别二
    ios开发之手势处理 之手势识别一
    ios开发事件处理之 四:hittest方法的底层实现与应用
    ios开发事件处理之:三 :寻找最合适的view
    ios开发事件处理之 :二:事件的产生与传递
    ios开发事件处理之:一:UIView的拖拽
    ios开发transform属性
  • 原文地址:https://www.cnblogs.com/xiaoxiao5ya/p/4791363.html
Copyright © 2011-2022 走看看