Jquery change(fontsize,background) 改变颜色与背景的代码

change(fn)
在每一个匹配元素的change事件中绑定一个处理函数。
change事件会在元素失去焦点的时候触发，也会当其值在获得焦点后改变时触发。

豪情

p{line-height:23px;margin:0;padding:0;}

$(function(){
$('#fontsize').change(function(){
var size = $('#fontsize').val();
$('p').css('font-size', size);
});
$('#backgoundcolor').change(function(){
var bgc = $('#backgoundcolor').val();
$('p').css('background', bgc);
});
$('#fontcolor').change(function(){
var fontcolor = $('#fontcolor').val();
$('p').css('color', fontcolor);
});
});

字体大小

小号
较小
中号
较大
大号

背景颜色

默认
淡灰
红色
绿色
明黄

字体颜色

黑色
红色
绿色
蓝色
棕色

春江花月夜

春江潮水连海平，海上明月共潮生。滟滟随波千万里，何处春江无月明。

江流宛转绕芳甸，月照花林皆似霰。空里流霜不觉飞，汀上白沙看不见。

江天一色无纤尘，皎皎空中孤月轮。江畔何人初见月？江月何年初照人？

人生代代无穷已，江月年年只相似。不知江月待何人，但见长江送流水。

白云一片去悠悠，青枫浦上不胜愁。谁家今夜扁舟子？何处相思明月楼？

可怜楼上月徘徊，应照离人妆镜台。玉户帘中卷不去，捣衣砧上拂还来。

此时相望不相闻，愿逐月华流照君。鸿雁长飞光不度，鱼龙潜跃水成文。

昨夜闲潭梦落花，可怜春半不还家。江水流春去欲尽，江潭落月复西斜。

斜月沉沉藏海雾，碣石潇湘无限路。不知乘月几人归，落月摇情满江树。

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

赞 (0)

相关推荐

  • jQuery中change事件用法实例

    本文实例讲述了jQuery中change事件用法.分享给大家供大家参考.具体分析如下: change事件会在匹配元素失去焦点或者其值获得焦点并且改变时触发. 一个完整的事件过程,不但要有能够触发事件的条件,而且还要有事件处理程序. 可以通过change()方法为change事件绑定事件处理程序.例如: 复制代码 代码如下: $("input").change(function(){$("input").css("backgroundColor",

  • JQuery触发radio或checkbox的change事件

    早上要做一功能,checkbox被选中时,显示隐藏的层,取消选中时,再隐藏选中的层. 初始代码如下: 复制代码 代码如下: $(function(){ $("#ischange").change(function() { alert("checked"); }); }); 捣腾了半天,竟然一点反应都没有.百度了下,有高人指出上面几行代码在Firefox等浏览器中可以正常运行,即你选中复选框或取消复选框都会弹出一个对话框,但是在IE中却不会正常执行,即选中或取消复选框

  • jquery中change()用法实例分析

    本文实例分析了jquery中change()的用法.分享给大家供大家参考.具体分析如下: change()当元素的值发生改变时,会发生 change 事件.该事件仅适用于文本域(text field),以及 textarea 和 select 元素. 当用于 select 元素时,change 事件会在选择某个选项时发生.当用于 text field 或 text area 时,该事件会在元素失去焦点时发生.   一.change的用法 1.触发 change 事件:触发被选元素的 change

  • Jquery Change与bind事件代码

    Jquery的基本语法: 复制代码 代码如下: $("input[type='text']").change( function() { // 这里可以写你想要的验证代码: }); 2 当绑定一个文本框的时候 复制代码 代码如下: $(function () { $("#txtAssessmentTotal").change(function () { //这里写你想要的验证的代码: }) }) 为每个匹配元素的特定事件绑定事件处理函数. .bind() 方法是用于

  • jQuery不兼容input的change事件问题解决过程

    最近开发一个项目,需要实现用户在WEB表单里的多个INPUT框中输入数量后,立即自动计算加总各项输入的数量之和,并显示在指定的INPUT框中,这个功能实现的原理是简单的,就是只需要在INPUT的onchange事件中计算加总并将结果赋给指定的INPUT框中即可实现,代码如下: 复制代码 代码如下: $("input.syxcost").change(function(){    computeReceivedsyxcost(); } function computeReceivedsy

  • jquery mobile changepage的三种传参方法介绍

    本来觉得changePage 那么多option,传几个参数应该没问题结果翻遍国内外网站,基本方法只有三种 1,显性传参,就是利用url这个地址把参数带上,然后到changepage后的新页面,用函数分割下来,提取 2,利用全局变量,应该就是所谓的内存法,在changePage时候,把参数干脆搞个变量存起来,之后到新的页面再提取 3,利用storage了.localstorage,sessionstorage,格式正好是键值格式,先转字符,然后用的时候转成json对象用就是 实在话,不管哪种方法

  • Jquery change(fontsize,background) 改变颜色与背景的代码

    change(fn) 在每一个匹配元素的change事件中绑定一个处理函数. change事件会在元素失去焦点的时候触发,也会当其值在获得焦点后改变时触发. 豪情 p{line-height:23px;margin:0;padding:0;} $(function(){ $('#fontsize').change(function(){ var size = $('#fontsize').val(); $('p').css('font-size', size); }); $('#backgoun

  • jquery 实现的改变颜色与背景的代码 change(fontsize,background)补充2

    change(fn) 在每一个匹配元素的change事件中绑定一个处理函数. change事件会在元素失去焦点的时候触发,也会当其值在获得焦点后改变时触发. 豪情 p{line-height:23px;margin:0;padding:0;} $(function(){ $('#c-obj select').change(function(){ alert($(this).attr('id') + ': ' + $(this).val()); $('p').css($(this).attr('i

  • jQuery实现鼠标滑过Div层背景变颜色的方法

    本文实例讲述了jQuery实现鼠标滑过Div层背景变颜色的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <title>jQuery实现感应鼠标经过Div层变换图层背景颜色)</title> <style type="text/css"> .divbox{   height:300px;   width:200px;   background:#ffffff;   border

  • python之pyqt5通过按钮改变Label的背景颜色方法

    使用setStyleSheet方法修改得到自己想要的字体,大小,颜色 self.lab = QLabel("标签字体大小颜色", self) self.lab.setGeometry(50,50,300,200) self.setStyleSheet("QLabel{color:rgb(225,22,173,255);font-size:50px;font-weight:normal;font-family:Arial;}") color:rgb()中的四个参数,前

  • JQuery实现动态适时改变字体颜色的方法

    本文实例讲述了JQuery实现动态适时改变字体颜色的方法.分享给大家供大家参考.具体分析如下: JQuery动态适时改变字体的颜色,Ajax的效果类似,在文本框输入文字,再选择色块,输入的文字就会变成色块标示的颜色值,很不错的效果吧.如果运行有错,请刷新一次页面即可. 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1

  • 在shell或者perl中改变字体或背景的颜色

    在shell或者perl中改变字体或背景的颜色

    在shell下提到终端的颜色的时候不得不提到几个提示符变量: PS1:默认提示符,也就是远程登上系统之后,打开终端,我们天天见到的那个熟悉的提示符: [root@vps ~]$echo $PS1[\u@\h \W]$ PS2:就是我们命令一行写不完在我们命令行下我们打上"\",另起一行所显示的那个: [root@vps ~]$echo "hello" \> "world"hello world[root@vps ~]$echo $PS1[\

  • 通过jquery toggleClass()属性制作文章段落更改背景颜色

    通过jquery toggleClass()属性制作文章段落更改背景颜色

    定义和用法 toggleClass() 方法对添加和移除被选元素的一个或多个类进行切换. 该方法检查每个元素中指定的类.如果不存在则添加类,如果已设置则删除之.这就是所谓的切换效果. 然而,通过使用 "switch" 参数,您能够规定只删除或只添加类. 语法 $(selector).toggleClass(classname,function(index,currentclass),switch) 参数 描述 classname 必需.规定添加或移除的一个或多个类名.如需规定若干个类,

  • Jquery使用css方法改变样式实例

    本文实例讲述了Jquery使用css方法改变样式.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> &

  • 基于jQuery实现仿百度首页换肤背景图片切换代码

    基于jQuery实现仿百度首页换肤背景图片切换代码

    不多说了,先给大家展示效果图,本文支持源码下载哦,需要的朋友可以直接下载使用,代码很简单哦- 在线预览    源码下载 html代码: <a href="#">换肤</a> <div class="heitiao"></div> <div class="con"><img src="images/content.png" /></div> &l

  • Android实现状态栏和虚拟按键背景颜色的变化实例代码详解

    今天介绍一下,我在项目开发过程中,实现状态栏和虚拟按键背景颜色变化的方法,实现方式是,通过隐藏系统的状态栏和虚拟按键的背景,实现图片和背景显示到状态栏和虚拟按键下方.下面来看实现代码: 实现状态栏背景的设置 状态栏工具类 public class StatusBarUtil { /** * 设置沉浸式状态栏 * * @param activity 需要设置的activity */ public static void setTransparent(Activity activity) { //A

随机推荐