转载地址：http://aquarius-zf.iteye.com/blog/605144

在页面中我们最常见的页面元素就是input了，但是我们如何用JavaScript得到网页input中输入的value值呢，其实很简单，方法也不止一种，据我总结比较常用的就是下面的两种方法，闲话不多说了，下面那就来看看我说的方法吧： 
方法一、

<html>

<head>

<script language="javascript">

function print(){

var a=myform.name.value;

alert(a);

}

</script>

</head>

<body>

<form name="myform">

<input type="text" name="name" id="nn" />

<input type="button" name="button" value="获取" onclick="print()" />

</form>

</body>

</html>

这是获取网页input值的方法之一，给from一个名字然后在JavaScript的地方就可以用form的名字来调用form表单里input元素的value属性可以得到值，并把值赋给a，最后用JavaScript的alert()打印方法打印出来。必须有<form>标签，没有就获取不到

方法二、

<html>

<head>

<script language="javascript">

function print(){

var a=document.getElementById("nn").value;

alert(a);

}

</script>

</head>

<body>

<form>

<input type="text" name="name" id="nn" />

<input type="button" name="button" value="获取" onclick="print()" />

</form>

</body>

</html>

　　

JavaScript如何获得input元素value值的更多相关文章

  1. JavaScript如何获得input元素value的值

    在JavaScript中获取input元素value的值: 方法一: <!DOCTYPE html> <html> <head> <meta charset= ...

  2. jquery如何获取type=hidden的input元素的值？

    function setHiddenFields() { var hiddens = $("input:hidden"); $.each(hiddens, function (in ...

  3. HTML中,input元素的 Disabled属性 所产生的后端无法接收数据的问题

    背景 今天从前端提交 form表单 数据时,发现 设置 Disabled 的 input 元素的字段数据在后端无法接收到 原因 查阅资料(来自W3school): disabled 属性规定应该禁用 ...

  4. HTML5增加与改良的input元素

    h5中form表单中input新增的属性值 在HTML5中增加了许多新的标签和功能属性,今天我们来看一个Form表单在HTML5中新的使用方法.那么在HTML5中新加入的这个功能与之前咱们使用的功能区 ...

  5. JavaScript之控制表单元素的值

    表单元素.value 获取表单元素的值 表单元素.value='这是修改后的值' 修改表单元素的值 案例: (1)html <input type="text" id=&qu ...

  6. 笔记：HTML5中input元素新增的type值

    在HTML5中,input元素的type值增加了不少,使input的功能强大了很多. 但在各大浏览器中并不是所有的type值都支持. 以下是比较有用.并且浏览器支持的稍好一些的值: type=colo ...

  7. HTML5 input元素新的特性

    在HTML5中,<input>元素增加了许多新的属性.方法及控件.本文章分别对这三方面进行介绍. 目录 1. 属性 2. 方法 3. 新控件 1. 属性 <input>元素在H ...

  8. HTML中使用javascript解除禁止input输入框代码：

    转:表单中Readonly和Disabled的区别 参考资料: disabled和readonly区别: 参考博文1地址:http://blog.csdn.net/symgdwyh/article/d ...

  9. 了解HTML表单之input元素的23种type类型

    目录 传统类型 text password file radio checkbox hidden button image reset submit 新增类型 color tel email url ...

随机推荐

  1. [转载] Activiti Tenant Id 字段释疑

    TENANT_ID_ :  这个字段表示租户ID.可以应对多租户的设计. 转载自: http://www.cnblogs.com/yg_zhang/p/4201288.html http://www. ...

  2. Ubuntu忘记MySQL密码重设方法

    ====================忘了mysql密码,从网上找到的解决方案记录在这里==================== 结束当前正在运行的mysql进程 # /etc/init.d/mys ...

  3. 打包spring项目遇到的坑 Unable to locate Spring NamespaceHandler for XML schema ……shcema/context 产生的原因及解决方法

    图1 图2 问题原因:导致该问题的原因就是打包的时候,同时将 spring-context 和 spring-aop包提取到了我们的程序应用的包中,在package过程中,这2个依赖包的 XML sc ...

  4. maven的pom.xml举例

    <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http://mave ...

  5. c++11 decltype

    c++11 decltype decltype实际上有点像auto的反函数,auto可以让你声明一个变量,而decltype则可以从一个变量或表达式中得到类型.decltype在C++11标准制定时引 ...

  6. 年度编程语言最佳候选人：Kotlin vs. C

    转瞬之间,今年已进入为期不足一个月的倒计时模式.在编程语言界,谁将问鼎 2017 年度编程语言?诸多开发者众说纷纭,有人说是最近风头正盛且被纳入中国高考科目的 Python.有人认为还是老牌常青藤 J ...

  7. 沉迷AC自动机无法自拔之：[UVA 11468] Substring

    图片加载可能有点慢,请跳过题面先看题解,谢谢 这个鬼题目,上一波套路好了 先用题目给的模板串建\(AC\)自动机,把单词结尾标记为 \(val=1\),然后在建好的\(AC\)自动机上跑 \(dp\) ...

  8. 【bzoj4066】 简单题

    http://www.lydsy.com/JudgeOnline/problem.php?id=4066 (题目链接) 题意 维护一个矩阵,两个操作,给某一个元素加上A,求其中一个子矩阵的元素之和.强 ...

  9. mybatis与分布式事务的面试

    mybatis的面试: https://www.cnblogs.com/huajiezh/p/6415388.html 本地事务与分布式事务: https://www.cnblogs.com/xcj2 ...

  10. Codeforces Round #477 (rated, Div. 2, based on VK Cup 2018 Round 3) F 构造

    http://codeforces.com/contest/967/problem/F 题目大意: 有n个点,n*(n-1)/2条边的无向图,其中有m条路目前开启(即能走),剩下的都是关闭状态 定义: ...