精华内容
下载资源
问答
  • 本文实例讲述了js实现文本框宽度自适应文本宽度的方法。分享给大家供大家参考。具体如下: 一个会随着输入文本框的字符多少而自动增加宽度的JS代码,当我们在文本框中输入字符的时候,如果文本框的宽度定义太小的话...
  • 本文实例讲述了JavaScript实现将文本框的值插入指定位置的方法。分享给大家供大家参考。具体如下: 这里实现JavaScript文本框的值插入当前面指定位置,这在一些表单提交场合或许我们都用到过,本代码段是将文本框...
  • JavaScript-为文本框赋值

    千次阅读 2018-02-04 01:34:52
    1.首先我们需要搭建好HTML代码骨架,然后准备好文本框。我准备了6个文本框,一个单选框,一个复选框,一个按钮,就是为了区分只是为...2.运行结果如下: 3.接下来就是为文本框赋值,代码如下: 为文本框赋值

    1.首先我们需要搭建好HTML代码骨架,然后准备好文本框。我准备了6个文本框,一个单选框,一个复选框,一个按钮,就是为了区分只是为文本框赋值,对其他没有影响,代码如下:

    <!DOCTYPE html>
    <html>
    <head>
    	<title>为文本框赋值</title>
    </head>
    <body>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="button" value="确认">
    	<input type="checkbox">
    	<input type="radio">
    </body>
    </html>
    2.运行结果如下:


    3.接下来就是为文本框赋值,代码如下:

    <!DOCTYPE html>
    <html>
    <head>
    	<title>为文本框赋值</title>
    </head>
    <body>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="button" value="确认">
    	<input type="checkbox">
    	<input type="radio">
    
    	<script>
    		// 通过getElementsByTagName来获取标签名的集合
    		var inputs = document.getElementsByTagName('input');
    		// 声明两个变量,为for循环做准备
    		var i =0 ,length = inputs.length;
    		// 通过for循环赋值
    		for (; i < length; i++) {
    			input = inputs[i];
    			// 判断input的类型是不是文本框
    			if (input.type === 'text') {
    				// 为文本框赋值,因为是从 0 开始赋值的,所以想从 1 开始的话就需要 i + 1
    				input.value = i + 1;
    			}
    		}
    	</script>
    </body>
    </html>
    4.可以看到,每个文本框都被赋予了值,结果如图所示:


    5.这是一般的写法,上面代码还可以优化如下:

    <!DOCTYPE html>
    <html>
    <head>
    	<title>为文本框赋值</title>
    </head>
    <body>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="text"> <br>
    	<input type="button" value="确认">
    	<input type="checkbox">
    	<input type="radio">
    
    	<script>
    		// 通过getElementsByTagName来获取标签名的集合
    		var inputs = document.getElementsByTagName('input');
    		// 声明两个变量,为for循环做准备
    		var i =0 ,length = inputs.length;
    		// 通过for循环赋值
    		for (; i < length; i++) {
    			input = inputs[i];
    			// 判断input的类型是不是文本框
    			if (input.type !== 'text') {
    				// 结束本次循环,继续执行循环
    				continue;
    			}
    			// 为文本框赋值,因为是从 0 开始赋值的,所以想从 1 开始的话就需要 i + 1
    			input.value = i + 1;
    		}
    	</script>
    </body>
    </html>

    6.也许有人会奇怪,为什要用不等呢?其实这个在这里面效果不是很明显,就是如果未优化的代码里面嵌套循环如果多的话会造成代码的可读性下降,代码效率下降,所以一般建议用优化后的方法。

    展开全文
  • JS显示隐藏文本框内容

    千次阅读 2020-08-21 23:47:27
    问题: 当鼠标点击文本框时,里面的默认文章隐藏,当鼠标离开文本框时,里面的...显示隐藏文本框内容</title> </head> <body> <input type="text" name="" id="" value="手机" /> &l

    问题:

    当鼠标点击文本框时,里面的默认文章隐藏,当鼠标离开文本框时,里面的文字显示

    代码:

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>显示隐藏文本框内容</title>
    	</head>
    	<body>
    		<input type="text" name="" id="" value="手机" />
    		
    		<script type="text/javascript">
    			var text = document.querySelector("input");
    			
    			//获得焦点
    			text.onfocus = function(){
    				if(this.value == "手机"){
    					this.value = "";
    				}
    			}
    			
    			//失去焦点
    			text.onblur = function(){
    				if(this.value == ""){
    					this.value = "手机";
    				}
    			}
    		</script>
    	</body>
    </html>
    
    

    运行结果:

    在这里插入图片描述

    在这里插入图片描述

    展开全文
  • 本文实例讲述了js实现文本框走动跑马灯效果。分享给大家供大家参考。具体如下: 运行效果图: 小提示:直接复制下面分享的代码即可运行,大家可以自定义文字。 为大家分享的js实现文本框走动跑马灯效果代码如下 &...
  • 本文实例讲述了JS实现点击复选框将按钮或文本框变为灰色不可用的方法。分享给大家供大家参考。具体如下: 在注册时候经常会看不到,如果不点击阅读注册许可的话,提交按钮是灰色的,失效不能提交,必须点它一下,这...
  • jQuery-在JavaScript中重置文本框值如果我有这样的输入文本框:如何使用javascript或jQuery设置文本字段的值?您可能认为这很简单,但是我尝试了以下操作:使用默认值var a = document.getElementById("searchField...

    jQuery-在JavaScript中重置文本框值

    如果我有这样的输入文本框:

    如何使用javascript或jQuery设置文本字段的值?

    您可能认为这很简单,但是我尝试了以下操作:

    使用默认值

    var a = document.getElementById("searchField");

    a.value = a.defaultValue;

    使用jQuery

    jQuery("#searchField").focus( function()

    {

    $(this).val("");

    } );

    使用js

    document.getElementById("searchField").value = "";

    他们都没有这样做...:/

    9个解决方案

    109 votes

    用Java语言:

    document.getElementById('searchField').value = '';

    在jQuery中:

    $('#searchField').val('');

    那应该做

    David Laberge answered 2020-01-23T19:56:39Z

    10 votes

    使用jQuery,我发现有时使用attr清除文本框的值无效,在这些情况下,我发现使用attr可以完成此任务

    $('#searchField').attr("value", "");

    answered 2020-01-23T19:56:59Z

    3 votes

    像这样使用它:

    $("#searchField").focus(function() {

    $(this).val("");

    });

    它必须工作。 否则,它可能永远无法集中注意力。

    lukad answered 2020-01-23T19:57:24Z

    1 votes

    设定值

    $('#searchField').val('your_value');

    找回价值

    $('#searchField').val();

    Senad Meškin answered 2020-01-23T19:57:48Z

    1 votes

    尝试使用此:

    $('#searchField').val('');

    salar answered 2020-01-23T19:58:07Z

    0 votes

    首先,选择元素。 您通常可以这样使用ID:

    $("#searchField"); // select element by using "#someid"

    然后,要设置该值,请使用.val("something"),如下所示:

    $("#searchField").val("something"); // set the value

    请注意,只有在元素可用时,才应运行此代码。 通常的方法是:

    $(document).ready(function() { // execute when everything is loaded

    $("#searchField").val("something"); // set the value

    });

    pimvdb answered 2020-01-23T19:58:36Z

    0 votes

    我知道这是一个旧帖子,但这可能有助于阐明:

    $('#searchField')

    .val('')// [property value] e.g. what is visible / will be submitted

    .attr('value', '');// [attribute value] e.g.

    如果存在[属性值],则更改[属性值]无效。(用户|| js更改了输入)

    AnOldMan answered 2020-01-23T19:59:01Z

    0 votes

    这为我工作:

    $("#searchField").focus(function()

    {

    this.value = '';

    });

    Jose answered 2020-01-23T19:59:20Z

    -2 votes

    这可能是一个可能的解决方案

    void 0 != document.getElementById("ad") && (document.getElementById("ad").onclick =function(){

    var a = $("#client_id").val();

    var b = $("#contact").val();

    var c = $("#message").val();

    var Qdata = { client_id: a, contact:b, message:c }

    var respo='';

    $("#message").html('');

    return $.ajax({

    url: applicationPath ,

    type: "POST",

    data: Qdata,

    success: function(e) {

    $("#mcg").html("msg send successfully");

    }

    })

    });

    Malik Muhammad Bilal Awan answered 2020-01-23T19:59:44Z

    展开全文
  • 注意:有些浏览器为了安全起见,禁止执行本地脚本,请点击“运行”即可。 再查找资料的过程中,发现不仅仅change事件可以处理,其他事件也可以处理。例如:keyup事件等。这里再贴一下另外连个例子片段: //这个不是...

    HTML代码:

    //同步函数

    function synchronize(){

    document.getElementById('i1').value =document.getElementById('i2').value;

    //alert("同步成功");

    }

    //执行同步

    setInterval(synchronize,500);//同步的时间间隔,每0.5秒同步一次

    在第二个输入框中输入字符,会自动同步到第一个输入框。

    第一个输入框:

    第二个输入框:

    把上面的HTML代码保存成html格式文件,用浏览器打开,就可以看到效果了。注意:有些浏览器为了安全起见,禁止执行本地脚本,请点击“运行”即可。

    再查找资料的过程中,发现不仅仅change事件可以处理,其他事件也可以处理。例如:keyup事件等。这里再贴一下另外连个例子片段:

    //这个不是即时性的改变

    //这个是即时性的改变,但如果你用鼠标标操作他不会检测到,所以你可以把这上下两个结合下.

    展开全文
  • JS:获得并修改文本框的内容

    万次阅读 2018-09-09 23:10:50
    &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&...JavaScript"&gt; functi
  • 原生JS实现拖拽文本框的效果

    千次阅读 2019-08-16 15:54:13
    点下面这个超链接去我的github下载这个文件,打开即可运行 点此处下载 var d_box = document.getElementById('d_box'); var drop = document.getElementById('drop'); //鼠标在box中头部按下的时候 计算鼠标在盒子中...
  • JavaScript学习笔记3--文本框获得焦点,文本框里提示信息自动消失
  • javascript怎么给文本框赋值?

    千次阅读 2021-01-12 09:16:03
    JavaScript中先通过getElementsByTagName方法来获取标签名的集合,然后通过循环遍历所有文本框,通过input.value属性为文本框赋值。JavaScript文本框赋值代码如下:为文本框赋值// 通过getElementsByTagName来获取...
  • 本文实例讲述了js限制文本框只能输入中文的方法。分享给大家供大家参考。具体如下: 让文本框只能输入中文的方法及代码,如果你不小心输入了英文,它会自动倒回去,清空你的输入,直至你输入了中文它可会继续,很...
  • 可以直接找到某一行,如果不显示行号,则还要自己手功去查,想要此功能,你只需设置好TextArea ID,并加入代码中的JavaScript代码部分即可,文本框的长宽则是由CSS来控制的,你可试着修改一下,长宽的显示要与JS相...
  • 本文实例讲述了JS实现下拉菜单赋值到文本框的方法。分享给大家供大家参考。具体如下: 这里演示下拉菜单和文本框构建的介绍栏,将Select框中的值定位到INPUT文本输入框中,是下拉框赋值到文本框的实例,上网时候貌似...
  • 本文实例讲述了js文本框输入内容智能提示效果代码。分享给大家供大家参考。具体如下: 运行效果截图如下: 大体思路: 1.监听文本框事件。这里是用的keyup事件。大家可以尝试用onchange事件。不过感觉keyup事件的...
  • 本文实例讲述了js实现鼠标点击文本框自动选中内容的方法。...先来看看运行效果截图: 在线演示地址如下: http://demo.jb51.net/js/2015/js-mouse-click-pitch-style-codes/ 具体代码如下: <!DOCTYPE HTML PUBLI
  • 1.这里将介绍两种方法,分别是字符串和数组的方法。因为文本框获得是字符串,所以用字符串做拼接的方法是比较容易想到的,但是我们知道字符串是不可变得,需要多个字符串才能拼接...3.运行结果如图所示: 4.通过J
  • 刚学了点DOM节点树的操作方法和属性,边尝试着写一个不用手动设置id和双击事件的例子,折腾了N久终于弄出了摸样来了,代码如下:(说明:双击运行文本框里的代码,右击复制其内的代码,另存为*.htm文件即可测试) ...
  • JavaScript_问题_从text文本框读入数组

    千次阅读 2016-12-02 10:55:30
    如题,当我们想从文本框中读入数组时(假设数字由“,”隔开),可能会想这么干,: function duru(){ var shu=document.getElementById("wb").value; var shuru=shu.split(","); //可能下面就对shuru进行一...
  • 这是一个网页表单效果,让表单内的文本框支持加减运算,不过你要按正确的运算式输入,要不然它没有那么智能哦,比如输入1+5,文本框旁边会显示计算结果,这要归功于JavaScript的功能。 运行效果截图如下: 在线演示...
  • 本文实例讲述了js实现仿Discuz文本框弹出层效果。分享给大家供大家参考。具体如下: 这是一个在经典论坛曾经热讨论的问题,记得在QQ邮箱也有类似功能,Discuz7.0论坛同样也有,当你的鼠标单击文本框的时候,会弹...
  • 本例以颜色为例,为用户提供自动提示,展示效果和运行结果如图: 1、建立框架结构: 代码如下: <body> <form method=”post” name=”myForm1″> Color: <input type=”text” name=”colors” id=”...
  • 这里实现JavaScript将列表框或单选框选中的值累计加入到文本框中,在一些表单中,我们经常会看到这种功能,可以免去用户输入的麻烦,提升用户体验。变通一下,你还可以做出更多的类似功能来。 运行效果截图如下: ...
  • 本文实例讲述了JS模仿编辑器实时改变文本框宽度和高度大小的方法。分享给大家供大家参考。具体如下: 这里演示JS模仿编辑器中实时改变文本框大小,包括宽度和高度的方法,在一些在线编辑器,比如eWebEditor中,就有...
  • 在Web页面上,有时我们要在文本输入框给点提示信息,告诉用户在这个地方该输入什么内容,比如说“请输入评论内容...”等等之类的提示信息,当用户把光标单位在输入框的时候,不应该让用户去清除那些提示信息,我们...
  • 本文实例讲述了js实现文本框只允许输入数字并限制数字大小的方法。分享给大家供大家参考。具体如下: 这是一个很个性的输入框特效,规定文本框只允许输入数字,如果你执意要输入其它的字符,则输入的字符将自动消失...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 32,511
精华内容 13,004
关键字:

文本框里运行js