JQuery 数据表行高

2023-11-24

我有一个页面,人们可以输入名字/姓氏、电话、电子邮件和种族,然后单击“添加”,它会在数据表中添加一个条目。问题是点击添加后表格显示如下:

Table

如何调整每行的高度以使其正确显示。这是我的表的 html 代码:

<div id="table">
    <form id="add_nrow" title="Add">
        <br/>
        <label for="name">First Name</label><input type="text" name="fname" id="fname" class="required" rel="0" />
        <br />
        <label for="name">Last Name</label><input type="text" name="lname" id="lname" rel="1" />
        <br />
        <label for="name">Phone</label><input type="text" name="phone" id="phone" rel="3" />
        <br />
        <label for="name">Email</label><input type="text" name="email" id="email" rel="4" />
        <br />
        <label for="name">Ethnicity</label><input type="text" name="ethnicity" id="ethnicity" rel="5" />
        <br />   
        <input type="button" value="Add" id="addbtn" /><br/><br/>  
    </form>

    <table id="reg_more" border="1">
        <thead>
            <tr>
                <th>First Name</th>
                <th>Last Name</th>
                <th>Phone</th>
                <th>Email</th>
                <th>Ethnicity</th>
            </tr>
        </thead>
    </table>
</div>

这是我的 jquery 代码

$("#addbtn").click(addrow);
$('#reg_more').dataTable({
                "bLengthChange": false,
                "bInfo": false,
                "bPaginate": false,
                "bStateSave": true,
                "rowHeight": 'auto',
                "bFilter": true,
                "bSort": false,
                "bAutoWidth": false
            });


function addrow() {
    $('#reg_more').dataTable().fnAddData( [
        $('#fname').val(),
        $('#lname').val(),
        $('#phone').val(),
        $('#email').val(),
        $('#ethnicity').val()] );
    }

我真的有两个问题:

  1. 如何正确调整高度以便用户可以看到数据?
  2. 如果输入20个人的信息,我如何将所有数据输入到mysql数据库中?

正如你所看到的fiddle您的代码是正确的并且应该按预期工作。

在任何情况下设置行高,只需使用 css

 tr { height: 50px } 

我认为没有必要让它变得更复杂。

关于如何将数据插入数据库的问题,有大量的例子google.

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

JQuery 数据表行高 的相关文章

  • 如何使React表中的一列数据可点击?

    我正在使用 React Table React Bootstrap Table 2 在页面中显示表格并使用数据库 API 中的数据填充它 我想让其中一列中的值显示为链接 hrefs 此特定列仅包含 URL 我想要实现的是 如果我单击每行的
  • 背景突出显示代码块中的文本?

    我的目标是能够显示如下内容 我想要背景突出显示已经有的代码块内的一段代码语法高亮 我想在 Github 上托管于 Github Pages 上的 Markdown 文件上执行此操作 可以使用 kramdown markdown html c
  • 如何使用 ASP.NET 和 jQuery 返回 JSON

    我不知道如何用我的代码返回 JSON 数据 JS function ajax type POST url Default aspx GetProducts data contentType application json charset
  • Canvas GetImageData() / PutImageData() 在移动设备上的性能很糟糕

    我正在做一个小型 HTML5 游戏 在地图开头加载精灵时 我使用 GetImageData 循环遍历所有图像 PutImageData 进行一些处理 这在我的电脑上运行得非常好 但是在我的手机上却慢得可怕 PC 5 6 ms iPhone
  • 如何在 leaflet.js 中设置 layer.control 的样式?

    我正在尝试更改图层控件中的默认下拉菜单图标 我希望图标旁边有文字 有什么办法可以做到这一点吗 也许使用 JQuery 和 CSS 我正在开发一个基于此示例的传单项目 http leafletjs com examples layers co
  • Bootstrap 表单助手未选择完整的国家/地区名称

    我添加了引导表单助手来列出国家及其州 最初 它根本没有选择国家名称 但我设法用 jQuery 检索国家 地区名称 但它没有显示完整名称 这是表单的完整代码 div class signup form div class container
  • jQuery 更改事件未在输入元素上触发

    首先 我检查了与我的问题类似的每个主题 不幸的是 我还没有找到答案 我尝试结合一些答案 但没有成功 注 刚开始学习jQuery 所以这是我的问题 我创建了一个带有四个文本输入和一个按钮的表单 每个输入内部都有一个 svg 图标和一个占位符文
  • Javascript在底部,函数调用在主体?

    只是一个简单的问题 我遵循将所有 Javascript 文件保留在结束正文之前的文档底部的做法 但是我想在主体中调用一个函数 该函数会出现在 JS include 之前 因此失败 有没有办法让这个功能在不将文件移动到头部的情况下工作 Che
  • jQuery TableSorter 插件初始化时出错:无法读取未定义的属性“0”

    我想用 jQuery Plugin TableSorter 对我的表格进行排序 所以我得到这张表 table class zebra striped thead tr th Date th th Annonce th th Support
  • 如何在光标下的所有元素上调用 mouseover?

    我有一个网络应用程序 每次单击时都会创建一个点 见下文 当我将鼠标悬停在一堆点上时 我希望光标下的每个点都会触发 mouseover 或 mouseenter 事件 然而 只有一个事件被触发 即堆栈 顶部 的点的事件 当鼠标移动到一堆多个点
  • jQuery 的 css() 在应用于滚动事件时滞后

    我正在尝试实现一个简单的 固定标题 表 我知道这在理论上只能用 CSS 来完成 但是当涉及到 OSX Lion 及其消失的滚动条时 它效果不佳 所以我用 jQuery 来做 方法很简单 只有1 5行代码 inbox scroll funct
  • 我的 iPhone 6 获取 iPhone 5 媒体查询

    我不明白这里发生了什么事 我在 CSS 媒体查询中专门针对 iphone 5 media only screen and min device width 320px and max device width 568px some div
  • 使用 jquery 和 php 测试表单输入是否为 1 或 2 位整数

    我有一个表单 其中有五个字段全部设置为 maxlength 2 基本上 我希望唯一可以输入的值是一位或两位整数 因为在将值存储在数据库中之前对这些字段执行计算 是否有任何 jquery 不允许用户输入不是整数的值 另外 用 jquery 和
  • JQuery DataTable 单元格从行单击

    我正在尝试在 jquery 数据表上实现一个函数 该函数返回单击行的第一列和第四列 我正在遵循这个示例 它允许我操作单击的行http datatables net examples api select single row html ht
  • 点击问题:动态生成的链接不触发点击功能

    下面是两个代码片段 由于某种原因什么也没有发生 但来自同一个 JS 文件的其他 jQuery 函数在带有 UL 的页面上执行得很好 这是在盯着我看吗 ul class paganation li 1 li li a href 2 a li
  • 使用 JavaScript 的计时器

    我想使用java脚本实现计时器 我想随着间隔的变化而减少计时器 Example假设我的计时器从 500 开始 我想要根据级别减少计时器 例如1 一级定时器应减1 且递减速度应较慢 2 2级定时器应递减2 递减速度应为中等3 3级定时器应减3
  • 常规 JavaScript 可以与 jQuery 混合使用吗?

    例如 我可以采用这个脚本 来自 Mozilla 教程 https developer mozilla org en Canvas tutorial Basic usage
  • 如何在粘贴时获取文本区域输入字段的新值?

    我发现当我尝试从文本区域字段读取值时onpaste调用函数时 我得到字段的旧值 粘贴操作之前的值 而不是新值 粘贴操作之后的值 以下是此行为的演示 http jsfiddle net qsDnr http jsfiddle net qsDn
  • 使用 jQuery Tablesorter 操作后如何恢复当前页面?

    我正在使用 tablesorter 但无法找到有关插件 tablesorter 寻呼机的任何文档 问题是我有一个显示一些数据的表 并且在每一行中都有一个删除链接 该链接附加了要删除的元素的唯一标识符 显然 是否可以保存我正在删除的页面 然后
  • 通过 vh 和 vw 调整 css 字体大小

    所以我想根据容器的大小自动调整文本的大小 但是如果我使用类似的东西 font size 5vw 看起来不错 但是当我缩小页面时 高度开始变得太小 无论如何 我是否可以根据 vh 和 vw 调整文本大小 例如 如果我只是减小页面的宽度 那么高

随机推荐

  • 如何在 PySpark 中使用列值作为字典的键?

    我有一个小的 PySpark DataFramedf index col1 0 1 1 3 2 4 还有一本字典 LOOKUP 0 2 1 5 2 5 3 4 4 6 我现在想添加一个额外的列col2 to df 等于LOOKUP的值col
  • Oracle 存储过程和自定义数据类型

    我有一个 Oracle 存储过程 它采用两个参数 自定义数据类型和字符串 在Oracle中调用存储过程 我会执行以下操作 EXECUTE MY STORED PROCEDURE MYTYPE T 99 231 mystring 我如何使用
  • 从 Apache 的 Ant PropertyFile 任务中删除日期注释

    我在构建脚本中使用如下所示的 propertyfile 任务
  • 设置 QTreeWidget 标题文本的方法是什么?

    我已经检查过文档here我似乎找不到设置 QTreeWidget 标题或标题文本的方法 如果不设置标题 QTreeWidget 会在我的代码中自动使用数字 1 下面是输出的示例 我假设 QTreeWidget 有一个方法 但我找不到它 您正
  • 类型错误:db.collection 不是函数

    我正在尝试将数据发布到我在 mLab 上创建的数据库 但收到此错误 但我不知道出了什么问题 我还阅读了之前关于此主题提出的问题 但我无法解决我的错误 因为我是新来的 所以在这里我发布了我试图实现的代码 它取自本教程https medium
  • NHibernate 在二次更新中设置外键,而不是在初始插入时设置外键,违反了键列上的非空约束

    我对一个相当简单 我认为 的 NHibernate 用例有疑问 我有一个经典的父实体和子实体 如下所示 public class Parent public virtual int ParentId get set public virtu
  • 使用 Django 1.5 和 IPython 获取 NameError

    我正在运行 Django 1 5 1 Python 2 7 2 和 IPython 0 13 2 如果我在 Django 项目目录中执行 python manage py shell 则会收到以下错误 from django import
  • 为什么 List 不是 IEnumerable

    编辑 我很抱歉 最初的问题措辞含糊不清 我没有得到我正在寻找的答复 对于任何继承自类 Y 的类 X new List
  • 在C中使用宏定义数据结构

    我试图理解使用宏定义数据结构操作的概念 以下代码是使用 FreeBSD 中内置列表库的简单示例 在库中 所有操作都定义为宏 我也在其他几个库中看到了这种方法 我可以看到这有一些优点 例如 能够使用任何数据结构作为列表中的元素 但我不太明白这
  • ES6 - 在类中调用静态方法

    我有这个类 它对静态方法进行内部调用 export class GeneralHelper extends BaseHelper static is env return config get env name env static isP
  • 利用多核的单线程程序

    Java程序的单线程可以自动使用CPU上的多个核心吗 Java程序的单线程可以自动使用CPU上的多个核心吗 是和不是 单线程Java程序将使用多个线程 因为GC JMX 终结器和其他后台线程可以在不同的CPU 无论是CPU还是核心 中运行
  • Javascript:自己的键函数中的对象文字引用而不是“this”

    在作为该文字一部分的函数中引用对象文字是否有问题 它似乎工作得很好 但我想确保没有其他影响 这是我正在谈论的一个例子 代替 var obj key1 it key2 function return this key1 works alert
  • JQuery 获取以字符串“whatever-”开头的元素类名的其余部分

    我有 js 缓存名称以 whatever 开头的类 class whatever class whatever 但我现在想做的是获取名称的其余部分 例如 在 whatever 9 的情况下 我想获取 9 我不知道该怎么做 你能帮助我吗 Tr
  • 如何在Expression.Or中设置2个以上的Expression

    我想创建一个包含超过 3 4 个表达式的查询 或者 但是表达式 或者只是让我在其中添加两个表达式 if string IsNullOrEmpty keyword query Add Expression Or Expression Like
  • Div 高度不会调整以适应内容

    如何使 div 水平和垂直居中并调整高度以适应内容 fiddle 这是我的 html 代码 div class sprite div div class content span close span div class centered
  • 在Qt中添加自定义字体

    有没有办法向 Qt 添加自定义字体 例如 Console Font 如何 我们如何将其设置为文本编辑器 QPlainTextEdit QTextEdit 等 Thanks Qt 使用您的窗口系统作为字体提供程序 您可以使用以下命令找到所有可
  • 如何从discord.py 中的文本通道获取所有消息的数组?

    我有频道对象 并且我已经尝试过 mess channel history limit 200 but mess is a HistoryIterator对象并且其内不包含任何消息mess messages对象 大小 0 频道中有消息 所以不
  • 如何获取BitBucket分支url?

    我有一个 bitbucket 存储库 我知道我可以单击 操作 选项卡 然后单击 克隆 以获取存储库的 http url 现在 我在存储库中有多个分支 并且我计划使用 Jenkins CI 从特定分支进行构建 有没有办法获取我的存储库中特定分
  • 如何将 powerpivot 数据作为表格复制到 Excel 工作簿中?

    我在 powerpivot 中有已修改的数据 我想将其作为常规表 而不是数据透视表 放入工作簿中 我需要这个 以便我可以使用该表来运行同一工作簿中另一个工作表中的一些 vlookups 我找到了这个答案 link我将尝试进行总结 而不会进行
  • JQuery 数据表行高

    我有一个页面 人们可以输入名字 姓氏 电话 电子邮件和种族 然后单击 添加 它会在数据表中添加一个条目 问题是点击添加后表格显示如下 如何调整每行的高度以使其正确显示 这是我的表的 html 代码 div div