cell13.setAttribute("ondblclick", "makeEditable(this)");td class="editable" contenteditable="true">这两段代码结合使用
时间: 2023-11-03 18:48:49 浏览: 34
这两段代码结合使用的效果是在 HTML 表格中的每个单元格中添加一个双击事件,当双击单元格时,将该单元格的内容变为可编辑状态。具体实现是通过在每个单元格上设置 `ondblclick` 属性来为单元格添加双击事件,当触发双击事件时,调用 `makeEditable()` 函数将该单元格的 `contenteditable` 属性设置为 true,使其变为可编辑状态。
相关问题
cell13.contentEditable = true; cell13.setAttribute("ondblclick", "makeEditable(this)");正确吗
这段代码的作用是将具有id "cell13" 的元素的 contentEditable 属性设置为 true,这样可以使该元素变为可编辑状态。同时,该元素还被设置了一个 ondblclick 事件处理函数,当双击该元素时会调用 makeEditable 函数,但是这里的 makeEditable 函数并没有给出。所以正确与否需要看 makeEditable 函数的具体实现。
给这个单元格cell13.setAttribute("ondblclick", "makeEditable(this)")设置td.editable { background-color: lightgreen; }属性
可以这样写:
```
td.editable {
background-color: lightgreen;
}
```
然后在 JavaScript 中给单元格设置 `ondblclick` 事件:
```javascript
cell13.setAttribute("ondblclick", "makeEditable(this)");
```
在 `makeEditable` 函数中,将单元格的 `contentEditable` 属性设置为 `true`,并添加 `editable` 类:
```javascript
function makeEditable(cell) {
cell.contentEditable = true;
cell.classList.add("editable");
}
```
这样双击单元格后,单元格的背景色会变成浅绿色,并且可以编辑其内容。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
给下面代码增加分页功能,要求细致,逻辑清楚,<form action="./../selectNews" method="post"> <input type="text" name="key" id="key" placeholder="请输入标题"/> <input type="submit" value="查询"/> 发布新闻 返回主页 </form> 新闻编号 新闻标题 <%-- 新闻内容 --%> 新闻类别 发布人 发布时间 状态 是否头条 操作 <c:forEach items="${newslist}" var="u"> ${u.nid} ${u.title} <%-- ${u.content} --%> ${u.type} ${u.userName} ${u.pubTime} <c:choose> <c:when test="${u.state==0}">未审核</c:when> <c:when test="${u.state==1}">审核通过</c:when> <c:otherwise>未通过</c:otherwise> </c:choose> <c:choose> <c:when test="${u.top==0}">否</c:when> <c:otherwise>是</c:otherwise> </c:choose> <c:choose> <c:when test="${user.rule==1}"> 查看 修改 删除 审核 </c:when> <c:when test="${user.rule==0 && user.uid==u.uid}"> 查看 修改 删除 </c:when> <c:otherwise> 查看 </c:otherwise> </c:choose> </c:forEach>
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)