jQuery/Javascript如何动态添加td(表) [英] How Jquery/Javascript dynamically add td (table)

问题描述

我需要帮助，有什么想法吗?

I need help, any ideas?

首先，我想在页面打开时隐藏一些输入元素， 我的方法是创建下拉菜单$counter (1-8)，然后取决于$counter示例:3.

Firstly i want to hide some input element when page open, My approach creating dropdown $counter (1-8) and then depending on $counter Example:3.

我在tr #ID内动态创建/显示现有元素($counter)<td></td>.

I create/show existing element dynamically ($counter)<td></td> inside tr #ID.

jQuery如何解决这个问题?

How jQuery solve this problem?

您能提供给我jQuery中的开关案例的示例，以显示/隐藏具有定义的td #ID吗?

Can u provide me example of switch case in jQuery to show/hide with defined td #ID?

感谢之前

Rizq

推荐答案

假设您的输入的ID为"input-1"，则可以简单地将其隐藏:

Suppose your input has id of "input-1", then you can hide it simply doing:

// Assign a value to counter, might be some function to do that
var counter = '1';

// Get a reference to the element and hide it
var input = document.getElementById('input-' + counter);
input.style.display = 'none';

// or 

input.style.visibility = 'hidden';

并再次显示:

input.style.display = ''; // empty string

// or 

input.style.visibility = 'visible';

display 和 visibility 属性是前者将完全从文档流中删除该元素，而后者将使其不可见(请阅读W3C CSS规范的相关部分).混乱的显示可能会使文档在重排时略微跳动，对可见性的混乱使文档保持稳定，但留有空白.您最适合的选择.

The difference between the display and visibility properties is that the former will remove the element completely from the document flow, whereas the second will just make it invisible (read the relevant parts of the W3C CSS spec). Messing with display might make the document jump about a bit as it reflows, messing with visibility keeps it stable but leaves a blank space. Your choice which suits best.

您可以使用相同的方法隐藏和显示任何种类的元素.如果要使用父单元格或行，请在 parentNode 链中向上移动，直到适当地按下第一个TD或TR并将其隐藏.

You can hide and show any kind of element using the same method. If you want the parent cell or row, go up the parentNode chain till you hit the first TD or TR as appropriate and hide it.

Mozilla开发人员网站上有一些教程使用DOM API弄乱表元素.

There is a bit of a tutorial on the Mozilla developer site for messing with table elements using the DOM APIs.

这篇关于jQuery/Javascript如何动态添加td(表)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！