我们就用它来学习获取文本框的值及改变文本框的值。

代码如下 复制代码
<script>
function get1()
{
document.getElementById("txtbox2").value=document.getElementById("txtbox").value;

//获取文本框1的值，并赋值给文本框2
}
</script>

<table width="500" border="0" align="center" cellpadding="0" cellspacing="0">
<form id="form1" name="form1" method="post" action="">
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td align="center"><textarea name="txtbox" cols="32" rows="5" id="txtbox"></textarea><br />文本框1</td>
</tr>
<tr>
<td height="32" align="center"><input type="button" name="button" id="button" value="点击把文本框1的值赋给文本框2" onclick="get1();" /></td>
</tr>
<tr>
<td align="center"><textarea name="txtbox2" cols="32" rows="5" id="txtbox2"></textarea><br />文本框2</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</form>
</table>

通过以上代码我们可以很简单地学习到如何取值跟赋值。

因为value特性是个字符串，可以使用任何字符串的特性和方法。例如，可以使用length特性来获取文本框中的文本长度：

代码如下 复制代码
<html>
<head>
<title>Retrieving a Textbox Length Example</title>
<script type="text/javascript">
function getLengths(){
var oTextbox1=document.getElementById("txt1");
var oTextbox2=document.getElementById("txt2");
alert ("The length of txt1 is "+oTextbox1.value.leng(www.111cn.net)th+"n"
+"The length of txt2 is" +oTextbox2.value.length);
}
</script>
</head>
<body>
<input type="text" size="12" id="txt1"/><br />

<textarea rows="5" cols="25" id="txt2"></textarea><br />
<input type="button" value="Get Lengths "onclick="getLengths()" />
</body>
</html>

这个例子中使用value的length特性来判断每个文本框中的字符数

下面我们再来介绍jquery获取文本框的值的方法吧。

JQuery获取文本框的值

是通过

代码如下 复制代码
var val = $("#drugGeneralName").val();

val()方法来取得文本框属性的值的

文本框设定一个默认值。当光标移动到文本框时，如果文本框当前值是默认值，那么清空；离开文本框时，文本框值如果为空，那么将文本框值设置为默认值。实现思路就是这样的。

代码如下 复制代码
<input type="text" class="input" value="your name" />jQuery代码如下：

$(document).ready(function() {
//each遍历文本框
$(".input").each(function() {
//保存当前文本框的值
var vdefault = this.value;
$(this).focus(function() {
//获得焦点时，如果值为默认值，则设置为空
if (this.value == vdefault) {
this.value = "";
}
});
$(this).blur(function() {
//失去焦点时，如果值为空，则设置为默认值
if (this.value == "") {
this.value = vdefault;
}
});
});
});

最后，进行表单提交时，要先判断下当前文本框的值。如果为默认值的话，就不应该进行提交，而是给出相应的提示
from:http://www.111cn.net/wy/js-ajax/49622.htm

js/jquery获取文本框的值与改变文本框的值的更多相关文章

  1. js&jquery 获取select下拉框的值、文本内容、自定义属性

      js&jquery 获取select下拉框的值.文本内容.自定义属性 CreationTime--2018年7月2日09点22分 Author:Marydon html <selec ...

  2. js/jquery获取当前页面URL地址并判断URL字符串中是否包含某个具体值

    js/jquery获取当前页面URL地址并判断URL字符串中是否包含某个具体值本文介绍jquery/js获取当前页面url地址的方法,在jquery与js中获取当前页面url方法是一样的,因为jque ...

  3. js/jquery 获取本地文件的文件路劲 获取input框中type=‘file’ 中的文件路径(转载)

     原文:http://blog.csdn.net/niyingxunzong/article/details/16989947 js/jquery 获取本地文件的文件路劲 获取input框中type= ...

  4. js&jquery获取指定table指定行里面的内容

      js&jquery获取指定table指定行里面的内容 CreateTime--2018年5月18日11:46:04 Author:Marydon 1.展示 代码展示 <table s ...

  5. Js/Jquery获取iframe中的元素

    转载: Js/Jquery获取iframe中的元素 - - ITeye技术网站http://java-my-life.iteye.com/blog/1275205 在web开发中,经常会用到ifram ...

  6. js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选

    转载:https://www.cnblogs.com/ooo0/p/6278102.html js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) ...

  7. js,jquery获取下拉框选中的option

    js获取select选中的值: var sel=document.getElementById("select1"); var index = sel.selectedIndex; ...

  8. js jquery获取当前元素的兄弟级 上一个 下一个元素

    原博地址:http://www.jb51.net/article/71782.htm var chils= s.childNodes;  //得到s的全部子节点 var par=s.parentNod ...

  9. JS/JQuery获取当前元素的上一个/下一个兄弟级元素等元素的方法

    $(function(){ //遍历获取的input元素对象数组,绑定click事件 var len = $("input[type='file']").length; ; i & ...

随机推荐

  1. `UnityEditor.EditorUtility' does not contain a definition for `GetMiniThumbnail'

    I got the following errors with Untiy 4.0f7error CS0117: `UnityEditor.EditorUtility' does not contai ...

  2. Linux下如何修改Apache根目录

    创建自己需要更改的新目录,并更改宿主权限为apache用户 chown -R apache:apache /mnt/www   停止Apache服务 service httpd stop 3 修改Ap ...

  3. 1028作业：Java语法基础

    //1.输入长与宽计算长方形面积与周长.(用精度类型计算) package com.lovo.J133; import java.util.Scanner; public class Homework ...

  4. Windbg使用简明指南

    第一章 准备 1.1.    环境配置 _NT_DEBUGGER_EXTENSION_PATH=C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727 _NT_SY ...

  5. Takeown--夺取文件or文件夹所有权

    强制将当前目录下的所有文件及文件夹.子文件夹下的所有者更改为管理员组(administrators)命令:takeown /f * /a /r /d y 将所有d:\documents目录下的文件.子 ...

  6. zend studio 9 字体，颜色，快捷键等相关设置

    1.zend studio 9可以破解吗? 可以的,具体破解步骤查看:http://www.geekso.com/ZendStudio9-key/ 2.如何将zend studio 9的默认GBK编码 ...

  7. Spring相关

    一.Spring中ApplicationContext加载机制加载器目前有两种选择:ContextLoaderListener和ContextLoaderServlet. 这两者在功能上完全等同,只是 ...

  8. 学习iOS

    最近想学习一下iOS开发,不过一点基础都没有,得先从熟悉object-C语法开始,在此把学习中的一些知识点作为记录. mac pro常用操作 学习ios[1]Objective-C 基本语法 学习io ...

  9. JAVA 多线程随笔 (二) sleep, yield, join, wait 和notify

    这里先说明一下锁对象,如果一个类比如Person里的方法都有synchronized来修饰,那么每一个方法的锁对象就是Person的一个实例person. 锁对象也可以针对某个特定的实例, 比如syn ...

  10. Web cookie 详解

    总结:服务端客户端变量建议都是用 utf-8字符集, 前后传递的变量都建议使用url编码处理.php setcookie 保存到客户端的变量会自动url编码的, 所以客户端获取后需要decodeURI ...