正文
jquery按钮文本退格 jquery 回车
小程序:扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序
【扫一扫了解最新限行尾号】
复制小程序
怎么在jquery里清空文本框的内容
可以使用 jQuery 设置内容的val()方法来实现,设置内容为空即达到清空文本框内容的目的:
$("input[name='test']").val("").focus(); // 将name=test的文本框清空并获得焦点,以便重新输入
示例代码如下
创建Html元素
div class="box"
span点击按钮后清除文本框内容:/spanbr
div class="content"
input type="text" name="test" value="这是默认的内容"
/div
input type="button" class="btn" value="清除文本框内容"
/div
设置css样式
div.box{width:300px;height:250px;padding:10px 20px;margin:20px;border:4px dashed #ccc;}
div.boxspan{color:#999;font-style:italic;}
div.content{width:250px;height:100px;margin:10px 0;padding:5px 20px;border:2px solid #ff6666;}
input[type='text']{width:200px;height:30px;border:none;}
input[type='button']{width:120px;height:30px;margin:10px;border:2px solid #ebbcbe;}
编写jquery代码
$(function(){
$("input:button").click(function() {
$("input[name='test']").val("").focus(); // 清空并获得焦点
});
})
观察效果
初始状态
点击按钮清空文本框后
jQuery文本框输入格式限制valueChange replace光标移动问题
因为使用了替换,最好的办法是不要使用替换,在keypress时直接过滤。
给你一段我写的简单的封装成jquery插件的代码吧:
$.fn.bindIntTypeValidation=function(){
return this.keypress(function (e) {
var c = e.keyCode;
return c = 48 c = 57 || (c==45 this.value=='');
}).bind('paste', function (e) {
var d = e.originalEvent e.originalEvent.clipboardData || window.clipboardData;
return /^-?\d*$/g.test(d.getData('text'));
}).css('ime-mode','disabled');
};
使用方法:
$('#id1').bindIntTypeValidation();
jquery 文本框按下回车键执行事件 代码如何写?
$("#输入框id").keyup(function(){
if(event.keyCode == 13){
//这里写你要执行的事件;
}
});
扩展资料:
JQuery简单的按钮点击和文本框输入事件
%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%
%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
html
head
base href="%=basePath%"
titleMy JSP 'test.jsp' starting page/title
meta http-equiv="pragma" content="no-cache"
meta http-equiv="cache-control" content="no-cache"
meta http-equiv="expires" content="0"
meta http-equiv="keywords" content="keyword1,keyword2,keyword3"
meta http-equiv="description" content="This is my page"
!--
link rel="stylesheet" type="text/css" href="styles.css"
--
script type="text/javascript" src="script/jquery-1.8.3.min.js"/script
script type="text/javascript"
$(document).ready(function(){
$("#clickme").click(function(){
alert("Hello World click");
});
$('#clickmebind').bind("click", function(){
alert("Hello World bind");
});
$('#clickmeon').on('click', function(){
alert("Hello World on");
});
});
/script
script type="text/javascript"
//使用id的方式获取
$(document).ready(function(){
//1
$("#button_text1").click(function(){
var result1 = $("#input_text1").val();
alert("result1 = " + result1);
});
//2
$("#button_text2").click(function(){
var result2 = $("input[id='input_text2']").val();
alert("result2 = " + result2);
});
//3
$("#button_text3").click(function(){
var result3 = $("input[id='input_text3']").attr("value");
alert("result3 = " + result3);
});
//4. 可以通过type的值来获取input中的值(未演示)
/*
$("#button_text4").click(function(){
var result4 = $("input[type='text']").val();
alert("result4 = " + result4);
});
*/
//5. 可以通过name的值来获取input中的值(未演示)
/*
$("#button_text5").click(function(){
var result5 = $("input[name='text']").val();
alert("result5 = " + result5);
});
*/
});
/script
/head
body
h1根据ID来判定/h1
input type="button" name="clickmes" id="clickme" value="click me" /
input type="button" name="clickmebinds" id="clickmebind" value="clickme_bind" /
input type="button" name="clickmeons" id="clickmeon" value="clickme_on" /
!-- 获取文本框的值:方式一 --
div id="test1"
input id="input_text1" type="text" value="test1" style="width: 100px;" /
button id="button_text1"test1/button
/div
!-- 获取文本框的值:方式二 --
div id="test2"
input id="input_text2" type="text" value="test2" style="width: 100px;" /
button id="button_text2"test2/button
/div
!-- 获取文本框的值:方式三 --
div id="test3"
input id="input_text3" type="text" value="test3" style="width: 100px;" /
button id="button_text3"test3/button
/div
/body
/html
jquery如何实现点击一个按钮 div框从右→左,再点击按钮 div框从刚刚的位置移动回原来的位置?
1、新建一个html文件,命名为test.html。
2、在test.html文件内,使用div标签创建一行文字,文字内容为“小明”。
3、在test.html文件内,设置div标签的id属性为mytext,主要用于下面通过该id获得div对象。
4、在test.html文件内,使用button标签创建一个按钮,按钮名称为“切换内容”。
5、在test.html文件中,给button按钮绑定onclick点击事件,当按钮被点击时,执行func()函数。
6、在js标签中,创建func()函数,在函数内,通过id(mytext)获得div对象,通过html()方法获得div内的文本内容,使用if语句判断获得的文字内容是否为指定的文本内容,如果不是,则通过html()方法改变文本内容。
jquery按钮文本退格的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于jquery 回车、jquery按钮文本退格的信息别忘了在本站进行查找喔。