在这节，我们将看到如何把多行文本框的内容复制到剪贴板上。 注意：jQuery clipboard plugin 只支持IE 界面代码： 代码如下: 显示界面： 脚本部分： 代码如下: a { color: #0000FF; cursor: pointer; } $(document).ready(function () { $.clipboardReady(function () { $("a").click(function () { $("#").select(); $.clipboard($("#").val()); }); }); }); 加入脚本后点击复制按钮显示效果如下： 打开记事本按Ctrl+...
当用户要输入一些密码、信用卡信息和银行账号等敏感信息，用户更希望手工通过键盘敲入数据，而好过通过剪贴板复制粘贴。 我们先来看下实现后的效果： 输入新密码 复制新密码出现如下对话框 界面代码 代码如下: 脚本代码 代码如下: Recipe3 .header { background-color:Gray; font-weight:bold; font-size:large; } $(document).ready(function () { $("input:password").bind("copy cut paste", function (e) { // 通过...
这章内容比较简单，直接上页面代码： 代码如下: Recipe6 $(function () { $("#").click(function () { // 很简单，一行代码搞定 $("# input[type=checkbox]").attr("checked", $("#").is(":checked")); }); }); 效果图：JavaScript教程/参考手册 JavaScript热搜 Vue利用canvas实现移动端手写板的方法vue2.0 移动端实现下拉刷新和上拉加载更多的示例解决vue-router中的query动态传参问题解决使用vue.js路...
通过下面的代码可以实现这种切换的效果。 首先我们来看界面： 界面代码： 代码如下: 脚本代码： 代码如下: Recipe2 $(document).ready(function () { $("input:text:first").focus(); // TextBox转换成html控件为 $("input:text").bind("keydown", function (e) { if (e.which == 13) { // 获取Enter键值 e.preventDefault(); // 阻止表单按Enter键默认行为，防止按回车键提交表单 var nextIndex = $("input:text").index...
当文本框获得焦点，如果文本框内容跟提示内容一样，提示内容会自然消失。 当文本框没有任何值并失去焦点，文本框内容会重新生成默认提示。 为了实现上面的需求，代码如下： 代码如下: Recipe1 .defaultText { font-style: italic; color: #CCCCCC; } $(document).ready(function () { var searchBox = $("#"); // 通过ClientID获取服务器控件ID searchBox.focus(function () { if (searchBox.val() == this.title) { // T...
界面代码： 代码如下: 脚本代码： 代码如下: $(document).ready(function () { // 绑定keyup和change事件 $("#").bind("keyup change", function () { if ($(this).val() != "") { // 这里需要注意，$(this).text()获取的是整个集合的text属性内容，所以需要再过滤下，把选中的项取出来 $("#message").text("Text: " + $(this).find(":selected").text() + "Value: " + $(this).val()); } else { $("#message").text(""); } ...
简单来说，jQuery validation插件就是来校验表单form里面元素输入的内容是否满足业务规则，如果不满足，可以给出用户自定义的提示信息。该插件不仅默认有一些校验规则，如校验内容是否为空，内容的长度是否符合给定的值，还可以根据用户自定义业务规则，而且错误提示信息，也可以根据用户的要求自定义显示。看来这个插件的功能确实很强大，是不是迫不及待想使用了。好的，那我们就开始简介如何使用它。 jQuery validation 插件下载...
1.先准备界面代码： 代码如下: 2.RadioButtonList转换成，其成员转换为,下面是实现改变URL值的脚本代码： 代码如下: Recipe10 $(document).ready(function () { $("input[type=radio]").bind("change", function () { $("#").attr("href", $(this).val()); }); }); 3.实现界面效果： 4.另外我们可以通过下面的代码实现绑定change事件： 代码如下: $("input=[type=radio]").live("change", function(){ $("a").attr("hr...
首先准备好页面代码： 代码如下: 主要通过jQuery的append方法动态添加内容，脚本代码如下： 代码如下: Recipe8 $(document).ready(function () { $("#ddlFirst").bind("change", function () { // 添加change事件 $("#ddlSecond option").remove(); // 先删除所有项，以便重新加载 $("#ddlSecond").append("--- 请选择 ---"); if ($(this).val() == 1) { $("#ddlSecond").append("红色1"); $("#ddlSecond").append("红色2")...
要实现该效果，首先要先了解以下几点基础知识： 窗体滚动事件：$(window).scroll(function(){...}); 获取窗体滚动距离：$(window).scrollTop(); 获取窗体高度：$(window).height(); 了解以上内容就可以实现通过hyperlink控件实现返回顶部的效果了。 1.准备界面结构代码： 代码如下: 2.给回顶部控件添加样式： 代码如下: .backToTop { background-color: Yellow; width: 30px; border-style: outset; border-width: 1px; text-...
界面代码： 代码如下: 脚本代码： 代码如下: Recipe16 function rbCar_Validation(sender, args) { args.IsValid = ($("#rbCar :radio:checked").length > 0); } 显示效果： JavaScript教程/参考手册 JavaScript热搜 Vue利用canvas实现移动端手写板的方法vue2.0 移动端实现下拉刷新和上拉加载更多的示例解决vue-router中的query动态传参问题解决使用vue.js路由后失效的问题微信小程序实现换肤功能JS中touchs...
首先看下界面代码： 代码如下: 控件CustomValidator相关参数说明： ErrorMessage:设置校验提示信息 Display:设置显示模式，Dynamic表示提示信息不显示的时候，不占用当前位置 ClientValidationFunction:设置定义客户端自定义校验函数 客户端脚本代码： 代码如下: Recipe15 function ctvCar_Validation(sender, args) { // CustomValidator控件通过自定义函数的参数args属性IsValid来判断是否验证通过 args.IsValid = ($("#c...
下载地址：http://jqueryui.com/download，Theme选择Sunny 界面代码： 代码如下: 脚本代码： 代码如下: Recipe14 $(function () { $("#txtStartDate").datepicker(); $("#txtEndDate").datepicker(); $("#btnSubmit").click(function (e) { e.preventDefault(); var startdate = Date.parse($("#txtStartDate").val()); var enddate = Date.parse($("#txtEndDate").val()); if (startdate > enddate) { alert("开始时间不...
先看界面代码： 代码如下: DropDownList控件属性ToolTip会转换为Title，title的值可以作为校验规则required的提示信息，属性CssClass的值required就指定了插件的校验规则。 脚本代码： 代码如下: Recipe18 $(function () { $("#form1").validate({ errorLabelContainer: $("#message") }); }); .alertmsg { color: #FF0000; } 显示效果： 另外如果不设置DropDownList的属性ToolTip和CssClass,脚本代码改为如下，也可...
可限制最大输入字符长度 可设置字符截取速度 可自定义提示信息文本样式(可以改进自定义文本内容) 该插件统计英文字符和中文的长度是一样的。 废话少说，这里直接奉上详细插件代码，具体实现细节已经在代码里面有注释： 代码如下: ; (function ($) { $.fn.extend({ textAreaCount: function (options) { var $textArea = this; options = $.extend({ maxlength: 140, // 定义一个最大输入长度变量,初始化为500 speed: 15, // 定义删...