input设置成readonly，如何再赋值
时间: 2023-11-07 18:13:42 浏览: 38
如果将 `input` 元素的 `readonly` 属性设置为 `true`，那么该元素就无法再被用户修改。如果你需要动态地修改 `input` 元素的值，可以通过 JavaScript 代码来实现。
首先，你需要获取这个 `input` 元素的引用，可以使用 `document.getElementById()` 方法或者 `document.querySelector()` 方法来获取。例如，如果你的 `input` 元素的 `id` 属性设置为 `myInput`，那么你可以这样获取它的引用：
```javascript
var myInput = document.getElementById("myInput");
```
或者
```javascript
var myInput = document.querySelector("#myInput");
```
然后，你可以使用 `value` 属性来设置 `input` 元素的值：
```javascript
myInput.value = "新的值";
```
注意，尝试修改 `input` 元素的值时，需要确保 `readonly` 属性已经被移除或设置为 `false`。否则，你仍然无法修改 `input` 元素的值。
相关问题
el-input赋值后无法输入
您好！对于无法输入的问题，可以检查以下几个方面：
1. 检查是否正确绑定了 v-model 属性：在 el-input 组件上使用 v-model 属性可以实现双向数据绑定。确保将 v-model 绑定到一个在 data 中定义的变量上，例如：
```html
<el-input v-model="inputValue"></el-input>
```
在 data 中定义 inputValue 变量：
```javascript
data() {
return {
inputValue: ''
}
}
```
2. 检查是否存在其他事件或属性的影响：有时候可能会存在其他事件或属性对 el-input 的输入进行限制或影响。请检查是否有设置了 disabled、readonly 或者 @input 事件等。
3. 检查是否存在样式覆盖问题：有时候自定义的样式可能会覆盖了 el-input 的默认样式，导致无法输入。可以尝试移除或调整自定义样式，看看是否能够解决问题。
希望以上的建议可以帮助您解决 el-input 赋值后无法输入的问题！如果还有其他疑问，请随时提问！
<div style="padding:5px 0px;"> 本人计划自 <input datafld="qxlj_kssj" datasrc="#bind_70" id="kssj" mindex="20" name="kssj" onclick="WdatePicker({dateFmt:'yyyy-MM-dd'})" readonly="readonly" style="border-bottom: 1px solid; width: 130px; color: rgb(0, 0, 0); padding-left: 10px;" type="text" /> 至<input datafld="qxlj_jssj" datasrc="#bind_70" id="jssj" mindex="21" name="jssj" onclick="WdatePicker({dateFmt:'yyyy-MM-dd'})" readonly="readonly" style="border-bottom: 1px solid; width: 130px; color: rgb(0, 0, 0); padding-left: 10px;" type="text" /> （休假<input class="input6" datafld="qxlj_qjts" datasrc="#bind_70" id="qjts" mindex="24" name="qjts" style="width: 40px; padding-left: 10px;" type="text" readonly="readonly"/> 天，其中工作日<input class="input6" datafld="qxlj_qjgzrs" datasrc="#bind_70" id="qjgzrs" mindex="25" name="qjgzrs" style="width: 40px; padding-left: 10px;" type="text" readonly="readonly"/> 天，节假日、公休日<input class="input6" datafld="qxlj_gxrs" datasrc="#bind_70" id="gxrs" mindex="26" name="gxrs" style="width: 40px; padding-left: 10px;" type="text" readonly="readonly"/> 天） </div>根据以上代码当点击完kssj和jssj的input后自动计算休假天数并赋值给qjts
根据你提供的代码，当点击完 "kssj" 和 "jssj" 的输入框后，你想要自动计算休假天数并将结果赋值给 "qjts" 输入框。我将为你提供一段 JavaScript 代码，用于实现这个功能：
```javascript
// 获取 "kssj" 和 "jssj" 输入框元素
var kssjInput = document.getElementById("kssj");
var jssjInput = document.getElementById("jssj");
// 监听 "kssj" 和 "jssj" 输入框的点击事件
kssjInput.addEventListener("click", calculateVacationDays);
jssjInput.addEventListener("click", calculateVacationDays);
// 计算休假天数并赋值给 "qjts" 输入框的函数
function calculateVacationDays() {
// 获取 "kssj" 和 "jssj" 输入框的值
var kssjValue = kssjInput.value;
var jssjValue = jssjInput.value;
// 计算休假天数（这里只是示例，你需要根据实际需求进行计算）
var vacationDays = /* 在这里进行休假天数的计算 */;
// 将计算结果赋值给 "qjts" 输入框
var qjtsInput = document.getElementById("qjts");
qjtsInput.value = vacationDays;
}
```
请注意，上述代码中的 `/* 在这里进行休假天数的计算 */` 部分需要根据你的实际需求进行休假天数的计算逻辑编写。你可以使用日期计算库，如 Moment.js 或日期对象的相关方法来计算日期差值，并将结果赋值给 "qjts" 输入框。
另外，你可能还需要确保在文档加载完成后执行这段 JavaScript 代码，可以将代码放置在 `<script>` 标签中，或者在 `<body>` 标签最底部使用 `<script>` 标签包裹代码。
相关推荐
最新推荐
麦肯锡-年月―中国xx集团战略咨询项目建议书.ppt
麦肯锡-年月―中国xx集团战略咨询项目建议书.ppt
廖倩5.14运营款.xlsx
廖倩5.14运营款.xlsx
setuptools-25.0.2-py2.py3-none-any.whl
文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库，如NumPy、Pandas和Requests，极大地丰富了Python的应用领域，从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径，而且为经验丰富的开发者提供了强大的工具，以高效率、高质量地完成复杂任务。例如，Matplotlib和Seaborn库在数据可视化领域内非常受欢迎，它们提供了广泛的工具和技术，可以创建高度定制化的图表和图形，帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。
全网第一个宝宝生活记录网站root ca
全网第一个宝宝生活记录网站，帮我写一个网站介绍，网址 https://43.136.21.175/ ，二维码分享和登录，统计记录最近时间，功能很全很实用，手机和电脑都可以访问，手机浏览器可以生成快捷方式到桌面和App一样，点右上角可以打开菜单，里面我做了图表统计可以看每天的喂养次数哪些，我们一直在用，很方便的
yes I can.mp3
yes I can.mp3
zigbee-cluster-library-specification
最新的zigbee-cluster-library-specification说明文档。
管理建模和仿真的文件
管理Boualem Benatallah引用此版本：布阿利姆·贝纳塔拉。管理建模和仿真。约瑟夫-傅立叶大学-格勒诺布尔第一大学，1996年。法语。NNT：电话：00345357HAL ID：电话：00345357https://theses.hal.science/tel-003453572008年12月9日提交HAL是一个多学科的开放存取档案馆，用于存放和传播科学研究论文，无论它们是否被公开。论文可以来自法国或国外的教学和研究机构，也可以来自公共或私人研究中心。L’archive ouverte pluridisciplinaire
实现实时数据湖架构：Kafka与Hive集成
# 1. 实时数据湖架构概述**
实时数据湖是一种现代数据管理架构，它允许企业以低延迟的方式收集、存储和处理大量数据。与传统数据仓库不同，实时数据湖不依赖于预先定义的模式，而是采用灵活的架构，可以处理各种数据类型和格式。这种架构为企业提供了以下优势：
- **实时洞察：**实时数据湖允许企业访问最新的数据，从而做出更明智的决策。
- **数据民主化：**实时数据湖使各种利益相关者都可
2． 通过python绘制y=e-xsin(2πx)图像
可以使用matplotlib库来绘制这个函数的图像。以下是一段示例代码：
```python
import numpy as np
import matplotlib.pyplot as plt
def func(x):
return np.exp(-x) * np.sin(2 * np.pi * x)
x = np.linspace(0, 5, 500)
y = func(x)
plt.plot(x, y)
plt.xlabel('x')
plt.ylabel('y')
plt.title('y = e^{-x} sin(2πx)')
plt.show()
```
运行这段
JSBSim Reference Manual
JSBSim参考手册，其中包含JSBSim简介，JSBSim配置文件xml的编写语法，编程手册以及一些应用实例等。其中有部分内容还没有写完，估计有生之年很难看到完整版了，但是内容还是很有参考价值的。