js获取和设置<input>的值

最新推荐文章于 2023-12-12 15:24:02 发布
最新推荐文章于 2023-12-12 15:24:02 发布
阅读量10w+ 收藏 10
点赞数 8
分类专栏： js 文章标签： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/superit401/article/details/51762597
版权 
<span style="font-size:18px;"><!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <title>Document</title>
  <script type="text/javascript" src="jquery.js"></script>
 </head>
 <body>
  获取和设置input的值：<input type='hidden' id='provSelect1' name='provSelect1' runat='server' value='111' />
<script>
    window.onload = function(){
        var psel = document.getElementById("provSelect1");
        alert("获取到的value：" + psel.value+" ,"+$("#provSelect1").val()); //获取
        psel.value = "123"; //设置
        alert("设置后的value：" + psel.value); //设置后的
    };

	$(document).ready(function(){
        var val = $("#provSelect1").val(); //获取
        alert("获取到的value：" + val); 
        $("#provSelect1").val("123"); //设置
        alert("设置后的value：" + $("#provSelect1").val());
    });
</script>
 </body>
</html></span>

1.比较window.onload = function(){}和$(document).ready(function(){}的执行顺序

2.去掉<input>中的value='111'  在试试，可以发现在<input>没有设置vallue属性的时候人可以通过$("#provSelect1").val("123");给其添加value属性并赋值为123；

3.比较单纯的js和jQuery这个js轻量级框架插件的区别与联系


ispotu
关注
  • 8
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 5
    评论
专栏目录
JS获取input[file]的值并显示在页面的实现方法
10-18
下面小编就为大家分享一篇JS获取input[file]的值并显示在页面的实现方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
JS常用的获取值和设值的方法
qq_38056518的博客
01-08 609
input 标签 <input type="text" name="username" id="name"/> 1) 获取input值的多种方法： var name = document.getElementById("name"); var name = document.getElementsByName("username"); var name =...
js jquery给input标签赋值、取值
信徒博客
04-03 2万+
html代码 <input type="text" id="name"/> 赋值 $("#name").val('test');//赋值 取值 var name=$("#name").val();
js实现input的赋值
热门推荐
wilson_m的博客
03-10 19万+
input框赋值 如下所示，是一个文本框的html代码，实际开发中，要涉及到将数据库中的数据取出然后放入input框中。 &lt;input id="name1" name="teacherName" type="text" /&gt; 通过以下js代码可以实现对input文本框进行赋值，以下方法分别针对不同的情况，但是前两种是通用的。 $('#nam...
前端笔记45——JavaScript获取和设置input的值
裕博的博客
01-01 4159
前言 在前面的前端笔记44——获取或者修改div内容中提到修改div中的内容。但是input标签中，获取和设置的方法和前面的博客是有区别的。 代码示例 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt; &lt;/he
JS针对动态增加表格的INPUT取值、赋值与传参的研究
weixin_41760494的博客
02-28 1372
JS针对动态增加表格的INPUT取值、赋值与传参的研究第一部分，知识点总结：innerhtmlinsertROWclonepush();alert();document.write();fous();H5的dataformAttribute('');AJAX的data:$('#form1').serialize()JQUERY的var form = $("form[name=gagForm]");深拷贝与浅拷贝第二部分，数组的拆分、赋值与传参 第一部分，知识点总结： 上一节我们回顾了用innerHTML()
原生js给input赋值并获取用|分割
u010234868的专栏
06-10 2832
<input type="text"> <input type="text"> <input type="text"> <input type="text"> <input type="text"> <input type="text"> <input type="text"> <input type="text"> <input type="text"> <input type="button
js input 框的各种属性设置与应用
qq_46331926的博客
02-24 4305
一、由3D场景下的坐标点，来绘制一个原生 input 输入框： /** * 绘制输入框 * @param {THREE.Vector3} point1 * @param {THREE.Vector3} point2 * @param {string} type 尺寸线类型【position、size】 * @param {string} axisDir 尺寸线所在轴向 * @param {string} dir 表示这一条尺寸线，在相机视角下，
如何获取input输入框中的值？
xm2by的博客
06-05 4万+
如何获取input输入框中的值？ 1、javascript
JavaScript中input常用方法
weixin_43894771的博客
03-11 1万+
表单对象常用事件： onfocus：在表单元素收到输入焦点时触发； onblur：在表单元素失去输入焦点时触发。 如：文本框失去焦点时，以下代码将调用myfun()函数。 表单控件元素对象常用方法 blur() 让光标离开当前元素 focus() 让光标落到当前元素上 select() 用于种类为text，textarea，password的元素，选择用户输入的内容 click() 模仿鼠标单击...
js 获取input点选按钮的值的方法
10-26
主要介绍了js 如何获取input点选按钮的值,需要的朋友可以参考下
js获取input标签的输入值实现代码
10-27
input标签的输入值通过js进行获取，部分标签和类是封装在框架内的，其效果和html标签差不多，具体实现如下，感兴趣的朋友可以参考下，希望对大家有所帮助
jquery获取input输入框中的值
10-16
如何用javascript获取input输入框中的值，js/jq通过name、id、class获取input输入框中的value。接下来本文通过代码讲解，需要的朋友参考下
js与jquery获取input输入框中的值实例讲解
11-21
如何用javascript获取input输入框中的值，js/jq通过name、id、class获取input输入框中的value 先准备一段 HTML <input type="text" name"username" id="user" placeholder="用户名" class="uusr"><br> 一、...
js中input框中的值的获取方法；
最新发布
tianxianghuiwei的博客
12-12 2461
替换为您输入框的实际ID，或使用其他选择器（如类名、标签名）来获取输入框元素。input框的值的获取方法有三种。请读者根据需求自行选择。
js获取/设置input值
qq_34599639的博客
09-26 4417
js/jq 操作input
JavaScript 获取 input 输入框内容的几种方法
每天都想吃好吃的
06-29 1万+
```例如： let inputText = document.getElementsByTagName("input")[0].value;```例如：let inputText = document.getElementsByName("input")[0].value;```例如：let inputText = document.querySelector("#input").value;````例如：let form = document.forms[0];
javascript学习之＜input＞ 元素属性和方法
白话机器学习
08-04 2306
input>元素主要用于表单组件，它继承了 HTMLInputElement 接口。
在下述petite-vue代码中，rows是根据循环判断的合并行数，该如何获取rows的值呢 <table> <colgroup> <col width=20%> </col> <col width=40%> </col> <col width=40%> </col> </colgroup> <th> <td colspan="4"> 附件 </td> </th> <tr> <td :rowspan="rows"> 附件 </td> <td>名称</td> <td>数量</td> </tr> <tr v-for="(item,index) in data.list" v-show="item.status=='1' && item.type=='附件' "> <td><input type="text" v-model="item.info.名称" /></td> <td><input type="text" v-model="item.info.数量" /></td> <td><input type="button" value="删除" @click="del(index)" /></td> </tr> <tr> <td colspan="3"> <input type="button" value="添加" @click="add3"> </td> </tr> </table>
06-13
在这段代码中，`rows` 是通过循环判断计算得出的一个值，我们可以使用计算属性来获取它。 首先，在组件对象中定义一个计算属性 `rows`，在该属性的 getter 函数中进行循环判断并返回对应的值。例如： ```js import { defineComponent } from 'petite-vue'; const myComponent = defineComponent({ computed: { rows() { let count = 0; for (let item of this.data.list) { if (item.status === '1' && item.type === '附件') { count++; } } return count; } }, methods: { // ... }, data() { return { // ... }; } }); ``` 在上面的例子中，我们通过循环遍历 `data.list` 数组，统计满足条件的元素个数，并将其作为计算属性 `rows` 的值返回。 接下来，我们可以在模板中使用 `rows` 计算属性来设置 `<td>` 元素的 `rowspan` 属性。例如： ```html <table> <colgroup> <col width="20%"> <col width="40%"> <col width="40%"> </colgroup> <th> <td :colspan="rows">附件</td> </th> <tr> <td :rowspan="rows">附件</td> <td>名称</td> <td>数量</td> </tr> <tr v-for="(item, index) in data.list" v-show="item.status === '1' && item.type === '附件'"> <td><input type="text" v-model="item.info.名称"></td> <td><input type="text" v-model="item.info.数量"></td> <td><input type="button" value="删除" @click="del(index)"></td> </tr> <tr> <td colspan="3"> <input type="button" value="添加" @click="add3"> </td> </tr> </table> ``` 在上面的例子中，我们使用 `:rowspan="rows"` 将 `<td>` 元素的 `rowspan` 属性绑定到计算属性 `rows` 上，这样它的值就会自动更新并反映到模板中。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值