`

javascript双击获取当前单元格的内容怎么实现啊?

阅读更多

javascript双击获取当前单元格的内容怎么实现啊?

 

我在书上看的写法是 

 

 

 

<table id="tb" border="1" ondblclick="dbc()">

<tr><td>表格1</td><td>表格2</td></tr>

<tr><td>表格11</td><td>表格22</td></tr>

</table>

 

 

<script type="text/javascript">

 

var curCell;

 

function dbc(event){

 

if(event=null){

curCell=event.srcElement;

}else{

curCell=event.target;

}

 

alert(curCell.innerHTML);

 

}

 

</script>

 

我这里实现不了,该怎么弄呢?

0
4
分享到:
评论
3 楼 tomfish88 2011-06-24  
还是用jquery吧,直接用js太麻烦了
2 楼 tomfish88 2011-06-24  
先谢谢你,然后在仔细看看
1 楼 feige05 2011-06-24  
想帮下你真难,评论还要做'论坛规则小测验'累,还好蒙对了。
<table id="tb" border="1">
            <tr>
                <td>
                    表格1
                </td>
                <td>
                    表格2
                </td>
            </tr>
            <tr>
                <td>
                    表格11
                </td>
                <td>
                    表格22
                </td>
            </tr>
        </table>
        <script type="text/javascript">
            
            var curCell = {};
            function eventadd(elem, type, handle){
                if (!elem.nodeType && !!elem.length) {
                    for (var i in elem) {
                        e(elem[i])
                    }
                }
                else {
                    e(elem)
                }
                function e(el){
                    if (!!el.addEventListener) {
                        el.addEventListener(type, handle, false);
                    }
                    else 
                        if (el.attachEvent) {
                            el.attachEvent("on" + type, handle);
                        }
                }
            }
            
            function dbc(event){
                if (!!event.srcElement) {
                    curCell = event.srcElement;
                }
                else 
                    if (event.target) {
                        curCell = event.target;
                    }
                    else {
                        curCell.innerHTML = ''
                    }
                
                alert(curCell.innerHTML);
                
            }
            
            eventadd(document.getElementById("tb").getElementsByTagName("td"), 'dblclick', dbc)
        </script>

这个JS不是最好的,有很多情况没有考虑,
之前都是用jQuery框架很容易选择、绑定 事件,用习惯了,自己写一个还真不适应。呵呵。

相关推荐

    js实现双击单元格变文本框

    ### JavaScript 实现表格单元格双击变为可编辑文本框 #### 概述 在Web开发中,有时我们需要让用户能够方便地编辑表格中的数据。一种常见的做法是通过双击表格单元格将其转换为一个可编辑的文本框。这种方法既提高...

    怎么实现在表格中双击两下就可对里面的内容进行修改

    例如,以下是一段简单的VBA代码,它会在双击单元格时弹出一个消息框显示单元格内容: ```vba Private Sub Worksheet_BeforeDoubleClick(ByVal Target As Range, Cancel As Boolean) MsgBox "当前单元格内容:" &...

    js实现双击单元格变成文本输入框效果代码

    本文讲解了如何使用 JavaScript 实现双击单元格变成文本输入框效果代码的详细过程。这个代码可以方便用户编辑单元格的内容,提高了用户体验。但是,我们也需要注意到这个代码的缺点,避免在大规模的应用中使用 ...

    C#实现给DataGrid单元行添加双击事件的方法

    总结来说,为DataGrid的行添加双击事件主要是通过DataGrid的ItemDataBound事件,结合JavaScript的事件处理来实现的。这种做法允许我们在不改变DataGrid原有功能的基础上,增加用户交互,提高用户体验。同时,需要...

    FullCalendar扩展双击事件

    本文将深入探讨如何在FullCalendar中实现双击事件功能,包括源码修改和扩展方法,以兼容不同版本。 ### 1. 源码版双击事件 在源码版FullCalendar中添加双击事件功能,你需要直接修改FullCalendar的核心代码。首先...

    bootstrap table实现双击可编辑、添加、删除行功能

    在tdclick函数中,我们可以获取当前td元素的文本内容,并将其保存起来。然后,我们可以清空td元素的内容,并创建一个文本框,用于输入新的内容。 ```javascript function tdclick(tdobject){ var td=$(tdobject); ...

    Bootstrap Table 双击、单击行获取该行及全表内容

    Bootstrap Table 是一款流行...同时,通过具体的实例代码,学习如何实现双击、单击行获取行内容和全表内容的方法,以及相关的回调函数使用技巧。这将对于任何需要在Web项目中处理表格的开发者来说都是一个宝贵的参考。

    Layui组件Table绑定行点击事件和获取行数据的方法

    当用户双击某一行时,会触发事件函数,此函数中可以获取到当前行的索引,即Index。然后通过这个索引,可以从数据集中获取到相应的行数据。 一个典型的示例代码如下: ```javascript // 假设有一个div元素,其id为...

    jgrid cellEdit 单元格编辑模式

    jGrid,作为一款强大的JavaScript表格插件,为开发者提供了丰富的功能,其中cellEdit单元格编辑模式尤其受到青睐。本文将深入探讨jGrid的cellEdit模式,包括其基本原理、配置选项以及实际应用中的技巧,旨在帮助...

    双击表格即时编辑

    一旦捕获到双击事件,我们需要将当前选中的单元格转换为可编辑状态。这通常意味着将单元格内容替换为一个输入框(`&lt;input&gt;`)或者下拉选择框(`&lt;select&gt;`)。例如,可以创建一个输入框并设置其初始值为单元格内容: ...

    ASP.net GridView双击事件,弹出一个窗口显示详细信息

    总的来说,ASP.NET GridView双击事件的实现涉及前端的JavaScript监听和后端的事件处理。通过结合这两种技术,我们可以为用户提供一种直观且易于操作的方式来查看数据的详细信息。在实际开发中,还需要考虑用户体验、...

    php通过ajax实现双击table修改内容

    双击表格单元格以编辑内容是许多Web应用程序常见的用户交互功能。本文主要讨论如何利用PHP和Ajax技术来实现这一功能。本文档提供的代码示例是基于jQuery,它是一种快速、小型且功能丰富的JavaScript库,可以简化HTML...

    VUE页面中通过双击实现复制表格中内容的示例代码

    在本文中,将详细介绍如何在Vue页面中通过双击操作实现复制表格内单元格内容的功能。这里涉及的主要知识点包括Vue.js的基本使用、双击事件的绑定以及如何实现内容的复制功能。 首先,Vue.js是一个构建用户界面的渐...

    .net 双击td可以编辑

    标题中的".net 双击td可以编辑"是一个关于.NET框架下使用JavaScript实现表格(table)单元格(td)双击编辑功能的技术点。在Web应用中,用户界面的交互性通常是一个关键因素,允许用户通过双击某个元素来激活编辑...

    javascript实现datagrid

    JavaScript 实现 Datagrid 是在网页中创建数据展示和管理的一种常见技术。Datagrid 类似于电子表格,可以显示大量结构化的数据,并提供排序、筛选、分页和编辑等功能。在这个主题下,我们将深入探讨如何使用 ...

    获取table下每一行td的值

    在每一行中,我们通过`cells`属性获取到该行的所有单元格,并进一步获取每个单元格的`textContent`,即单元格内的文本内容。 如果你需要处理动态添加或删除的表格,可以监听`DOMSubtreeModified`事件,以实时更新...

    程序天下:JavaScript实例自学手册

    9.33 双击单元格变为可编辑 9.34 鼠标经过表格时列变色 9.35 鼠标选择表格中的多行 9.36 使用JavaScript向表格中写入数据 9.37 类C# GridView的编辑效果(一) 9.38 类C# GridView的编辑效果(二) 第10章 单选框和...

    Extjs 合并单元格

    总的来说,实现“Extjs 合并单元格”需要理解Ext JS的Grid Panel、Columns、渲染器工作原理,以及如何通过CSS和JavaScript操作DOM来达到合并效果。同时,还需要考虑用户体验和性能优化,确保合并功能的稳定性和效率...

Global site tag (gtag.js) - Google Analytics