使用 JavaScript 创建和复制/复制选择/选项列表菜单

2024-02-08

我有一个select列表菜单:

<label>
    <select name="select" id="select1">
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
    </select>
</label>

我想动态地用准确的信息复制它。我可以通过创建一个来做到这一点select元素并复制innerHTML从一开始select。 (我还生成了一个表行,我的select将会开启,但这并不重要):

var selectt = document.createElement("select");
selectt.setAttribute("name", "select"+counter);
selectt.setAttribute("id", "select"+counter);
selectt.onchange = function() {sellcalculate(counter); 

cell3.appendChild(selectt);
document.getElementById("select"+counter).innerHTML=document.getElementById("select1").innerHTML;

它在 Firefox 上运行良好,但 IE 只会创建选择,但不会复制选项。

我的第二个问题是:如何向创建的元素添加 onchange 事件?

 selectt.onchange = function(){sellcalculate(counter)};

这似乎不起作用。

这是编辑功能并解决 ie 问题后的完整功能:

function addRow(tableID) {
    var counter = document.getElementById('rowcounter').value;
    counter++;
    document.getElementById('rowcounter').value = counter;
    var table = document.getElementById(tableID);
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);
    var cell = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var element2 = document.createElement("input");
    element2.type = "text";
    element2.id = "amount" + counter;
    element2.onchange = function () {
        sellcalculate(counter)
    };
    cell2.appendChild(element2);
    var cell3 = row.insertCell(2);
    var selectt = document.createElement("select");
    selectt = document.getElementById("select1").cloneNode(true);
    selectt.setAttribute("name", "select" + counter);
    selectt.setAttribute("id", "select" + counter);
    selectt.onchange = (function (cntr) {
        return function () {
            sellcalculate(cntr);
        };
    })(counter);
    cell3.appendChild(selectt);
}

我现在无法在 IE 中测试,但请尝试使用.cloneNode()而是创建新元素。

var selectt = document.getElementById("select1").cloneNode(true);

selectt.setAttribute("name", "select"+counter);
selectt.setAttribute("id", "select"+counter);
selectt.onchange = (function( cntr ) {
    return function() { sellcalculate(cntr); };
})( counter );

cell3.appendChild(selectt);

The true参数传递给.cloneNode使其成为深度克隆(所有后代)。

另外,我假设你想要onchange处理程序来引用current的价值counter而不是潜在不同的未来值。因此,我使用新函数调用来确定当前值的范围。

现在无论价值如何counter是当此代码运行时将传递给的值sellcalculate().

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 JavaScript 创建和复制/复制选择/选项列表菜单 的相关文章

  • jQuery 选择 # id 以单词为前缀,计数器为后缀

    有没有办法用 jQuery 选择所有带有前缀 my 和后缀 0 9 的 id 像这样的 my 1 4 还是可以用循环来实现 div div div div div div div div div div 第一个想法 似乎效果很好 div i
  • 如何按照编写的顺序迭代 javascript 对象属性

    我发现了代码中的一个错误 我希望通过最少的重构工作来解决该错误 此错误发生在 Chrome 和 Opera 浏览器中 问题 var obj 23 AA 12 BB iterating through obj s properties for
  • 动画进度元素值

    我有一个progress元素 该元素如下所示 div class container div div div
  • 如何将此 HTML 表格布局解决方案转换为浮动 div 解决方案?

    我经常需要列出各种尺寸的项目images在左边和text在右边 像这样 替代文本 http www deviantsart com upload 7s01l5 png http www deviantsart com upload 7s01
  • Ember.js 处理 View 事件后转换到路由

    Setup 我有一个 Ember 应用程序 支持使用 Imgur API 上传图像 我已经有一个工作路线和模板来处理任何 Imgur ID 但我想在上传新图像后转换到此路线 使用返回的 Imgur ID 这是该应用程序的相关部分 http
  • 即使我可以监视其他方法,也无法监视事件处理程序

    我想使用 Jest Jasmine Enzyme 测试 React 中的事件处理程序 MyComponent js import React from react class MyComponent extends React Compon
  • jquery window.open 在 ajax 成功中被阻止

    尝试在我的 ajax 成功调用中打开一个新的浏览器窗口 但是 它被阻止为弹出窗口 我做了一些搜索 发现用户事件需要绑定到 window open 才能避免这种情况发生 我还找到了这个解决方案 您可以在 ajax 之前打开一个空白窗口 然后在
  • 如何通过php获取网页的Open Graph协议?

    PHP 有一个简单的命令来获取网页的元标记 get meta tags 但这仅适用于具有名称属性的元标记 然而 开放图谱协议如今变得越来越流行 从网页获取 opg 值的最简单方法是什么 例如 我看到的基本方法是通过 cURL 获取页面并使用
  • JavaScript 中数组的 HTML 数据列表值

    我有一个简单的程序 它必须从服务器上的文本文件中获取值 然后将数据列表填充为输入文本字段中的选择 为此 我想要采取的第一步是我想知道如何动态地将 JavaScript 数组用作数据列表选项 我的代码是
  • 如果链接包含特定文本,jQuery 将类添加到 href

    我的网站上的列表中有一些动态填充的链接 这些链接链接到文件 是否可以使用 jQuery 查看文件名是否以 pdf 结尾 并在 href 或类似的链接文本以 mp3 结尾时添加一个类 例如 我的列表中有以下链接 文件1 pdf 歌曲1 mp3
  • 如何延迟加载嵌入在 iframe 上的 YouTube 视频?

    如何将延迟加载应用于iframe嵌入视频 我尝试添加loading eager loading auto and loading lazyload 您可以使用srcdoc你里面的属性iframe标签来加载图像 请参阅以下示例作为参考
  • 如何流式传输 OpenAI 的完成 API?

    我想流式传输结果通过 OpenAI 的 API 完成 https beta openai com docs api reference completions 该文档提到使用服务器发送的事件 https developer mozilla
  • Typeahead.js substringMatcher 函数说明

    我只是在做一些研究Typeahead js这是一个非常酷的图书馆 感谢文档 我已经成功地获得了一个基本的示例 该文档也非常好 但是我试图弄清楚以下代码块实际上在做什么 var substringMatcher function strs r
  • 淡出和循环一组 div 的最佳方式

    假设我有以下 div div class a You are funny div div class b You are smart div div class c You are cool div 最好的展示方式是什么div a持续 5
  • JavaScript 代码在不使用 ActiveX 的情况下截取网站屏幕截图

    我有一个用户与之交互的 JavaScript 应用程序 我需要保存当前界面的外观 裁剪出我需要的部分 或者通过指定div只拍摄我需要的部分 然后发送回服务器 显然任何外部服务都无法做到这一点 我需要一个 JavaScript 或Flash
  • 数据表日期范围过滤器

    如何添加日期范围过滤器 like From To 我开始进行常规搜索和分页等工作 但我不知道如何制作日期范围过滤器 我正在使用数据表 1 10 11 版本 My code var oTable function callFilesTable
  • 如何在 javascript 正则表达式中匹配平衡分隔符?

    我原以为这个问题是不可能的 据我所知 Javascript 的正则表达式既没有递归插值 也没有漂亮的 NET 平衡组功能 但问题就在那里 如问题 12 所示正则表达式 alf nu http regex alf nu 匹配平衡对 lt an
  • 单击引导分页链接时调用 jquery 函数

    我想在单击引导分页链接时调用 jquery 函数 假设我想从第1页遍历到第2页 应该调用一个jquery函数 我正在使用以下代码 但它不起作用 ul pagination on click li function alert page ch
  • 如何在打字稿文件中导入没有定义文件的js库

    随着我们的项目变得越来越大 我想从 JavaScript 切换到 TypeScript 以帮助进行代码管理 然而 我们使用许多库作为 amd 模块 我们不想将其转换为 TypeScript 我们仍然想将它们导入 TypeScript 文件
  • 如何在 gulp.src 中使用基本正则表达式?

    我正在尝试选择两个文件gulp src highcharts js and highcharts src js 当然 我知道我可以使用数组表达式显式添加这两个表达式 但出于学习目的 我尝试为它们编写一个表达式 我读过可以使用简单的正则表达式

随机推荐

  • 如何跟踪表中数据的变化?

    我有一个简单的问题 如何跟踪 SQL Server 表中行的更改 这是我想要的一个例子 Table Users Columns 姓名 地址 用户名 用户类型 Row 1 克里斯托弗 123假街 情人1234 1 我如何跟踪用户将 Chris
  • ctypes 段错误 仅适用于 OSX

    我使用 ctypes 在 Python 中创建了一个非常简单的 C 库绑定 它所做的只是接受一个字符串并返回一个字符串 我在Ubuntu上进行了开发 一切看起来都很好 不幸的是 在 OSX 上完全相同的代码失败了 我完全被难住了 我整理了一
  • PHPExcel 创建/样式/保存 PDF 文档

    我在几个项目中使用 PHPExcel 库 并且喜欢它提供的功能 目前 我需要另存为 PDF 发现 PHPExcel 可以做到这一点 但我发现很难找到有关该过程的一些示例或文档 以下是我找到的链接 http phpexcel codeplex
  • 跟踪 Zaber 设备移动时的位置

    我正在编写一个 LabVIEW VI 来移动 Zaber 线性执行器 并且我想在设备移动时每隔几毫秒记录一次设备的位置 我已经安装了Zaber 的 LabVIEW 驱动程序 http www zaber com wiki Software
  • CloudKit fetchRecordChangesOperation 给出“AppDefaultZone 不支持同步语义”

    我使用 CKFetchRecordChangesOperation 和 CKFetchRecordsChangeToken 来获取更改 它告诉我 AppDefaultZone 不支持同步语义 这是有问题的代码 void downloadSe
  • 混合 Razor 和 Javascript 代码

    我对如何混合 razor 和 js 感到非常困惑 这是我目前坚持的功能
  • 如何处理 Java BigDecimal 中的舍入错误

    我正在与开源项目 axil 合作 该项目在java应用程序内部实现了脚本引擎 并且在尝试利用BigDecimal的舍入时遇到了一个主要的障碍 BigDecimal 似乎正在将我的输入转换为科学记数法 然后将我传递的精度应用于数字的 SN 表
  • 使用 C 编译器选项捕获浮点异常 [关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 Gfortran有得心应手的 ffpe trap编译器选项 但没有类似的选项可用gcc 我隐约意识到他们处理异常的方式不同 但不足以知道为什
  • 在 Firefox 中拖动时,输入类型=范围上的 onchange 事件不会触发

    当我玩的时候
  • 如何将多个注释合并为一个注释?

    我有两个来自框架的注释 我经常在同一字段上使用这两个注释 因此 我试图创建一个包含两者的 组合 注释 但我不知道这是否可能 现有注释 我无法控制 Target ElementType PARAMETER ElementType METHOD
  • 分享 mkmapview 截图

    我有一张地图 上面有很多东西 我想以图片 屏幕截图的形式分享 然而 据我所知 该地图 Apple 的 iOS 6 和 Google 的 iOS 5 均受版权保护 我不能简单地这样做 我想到了 Google Static Maps API 但
  • OpenID Connect 和 IDP 发起的 SSO

    我有一个作为服务提供商的应用程序 是否可以使用 OpenID Connect 实施 Idp 发起的 SSO 对于 Idp 发起的 SSO 来说 似乎只能使用 SAML 对吗 或者有没有办法让 OpenID Connect 也能工作 我正在考
  • Gridview 在 1 列上禁用编辑 asp.net

    我正在使用 gridview 编辑来编辑 gridview 中的值 当我按下编辑时 所有列都可以编辑 我希望不允许编辑其中一列 我有什么办法可以做到这一点吗 这是我的 aspx 代码
  • 将 JSON 数组转换为

    我正在 Microsoft Power BI 中创建自定义视觉对象 创建 api 使用 typescript 和 d3 库 我也在使用jquery 我正在尝试创建一个分层树来表示拖入视觉对象的字段 因此树的深度是在运行时决定的 所以它不知道
  • 如何通过单击按钮来切换 jTabbedPane 中的选项卡?

    我有两个 JTabbedPane JTabbedPane1 和 2 如何按下 JTabbedPane2 中的按钮来显示 JTabbedPane1 这是 JTabbedPane 的代码 public class TabbedPane exte
  • 如何在 R 中分组时创建排名列

    我正在使用 R 我想创建一个显示序列或排名的列 同时按两个因素 hhid 和句点 进行分组 例如 我有这个数据集 hhid perid 1000 1 1000 1 1000 1 1000 2 1000 2 2000 1 2000 1 200
  • PHP 高级作业队列

    我正在使用 cron 制作一个一天包含 2000 个作业的脚本 意味着这是服务器端并自动完成所有作业 但该作业需要同时运行 10 个 或指定数量的作业 作业 就像你看到 IDM 互联网下载管理器 一样 有一个队列功能 它一次运行多个作业 如
  • VBA 用户窗体保存文本框。在组合框中选择名称时将值保存到 Excel 工作表

    我提前为发布相同的问题表示歉意 但我不知道如何添加额外的代码示例 如果有办法在上一个问题中添加额外的代码 请告知 基本上 我试图将一些文本框值保存到我的工作表中 以便在用户窗体关闭并重新打开时可以重新启动它们 这就是我到目前为止所拥有的 但
  • LINQ:如何在 linq 中动态使用 ORDER BY,但前提是变量不是 string.empty 或 null

    我正在使用 LINQ2SQL 它运行得很好 但是 根据 C 中变量类型字符串的值 我需要在查询中使用 Order By 或不使用 order by 如果 C 字符串不为 null 或空 那么我想对字符串变量的内容进行 排序 如果 C 字符串
  • 使用 JavaScript 创建和复制/复制选择/选项列表菜单

    我有一个select列表菜单