当前位置:首页 > jquery

jquery 获取值

2026-03-02 20:12:19jquery

获取输入框的值

使用 val() 方法获取输入框(如 <input><textarea>)的值。

var inputValue = $('#inputId').val();

若需获取多个输入框的值,可通过遍历实现:

$('input').each(function() {
    console.log($(this).val());
});

获取下拉框(select)的值

对于单选下拉框,直接使用 val()

var selectValue = $('#selectId').val();

对于多选下拉框,需结合 map()get() 获取所有选中值:

var multiSelectValues = $('#multiSelectId').val() || [];

获取复选框(checkbox)的值

获取单个复选框的选中状态:

jquery 获取值

var isChecked = $('#checkboxId').is(':checked');

获取多个复选框选中的值:

var checkedValues = $('input[type="checkbox"]:checked').map(function() {
    return $(this).val();
}).get();

获取单选按钮(radio)的值

通过选择器获取选中的单选按钮值:

var radioValue = $('input[name="radioName"]:checked').val();

获取元素文本内容

使用 text() 获取元素的纯文本内容:

jquery 获取值

var textContent = $('#elementId').text();

使用 html() 获取包含 HTML 标签的内容:

var htmlContent = $('#elementId').html();

获取数据属性(data-*)的值

通过 data() 方法获取自定义属性值:

var customData = $('#elementId').data('key');

对应 HTML 示例:

<div id="elementId" data-key="value"></div>

注意事项

  • 若元素不存在,val() 返回 undefined,建议先检查元素是否存在。
  • 对于表单控件,确保在 DOM 加载完成后执行代码,可将代码放在 $(document).ready() 中。
  • 使用 prop() 方法可获取布尔属性(如 checkeddisabled)的状态。

标签: jquery
分享给朋友:

相关文章

jquery和vue的区别

jquery和vue的区别

jQuery 和 Vue.js 的区别 jQuery 和 Vue.js 是两种不同的前端技术,分别适用于不同的场景和开发需求。以下是它们的主要区别: 设计理念 jQuery 是一个轻量级的 Java…

jquery div

jquery div

jQuery 操作 div 元素 jQuery 提供了多种方法来操作 div 元素,包括选择、修改内容、样式调整、事件绑定等。以下是常见操作的示例: 选择 div 元素 通过 ID 选择 div:…

jquery判断

jquery判断

jQuery 判断元素存在与属性方法 使用 jQuery 判断元素是否存在可通过检查选择器返回的 jQuery 对象长度: if ($('#elementId').length > 0) {…

jquery使用

jquery使用

jQuery 基础使用 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。以下是一些常见的 jQuery 使用方法。 引入 j…

jquery 字符串

jquery 字符串

jQuery 字符串操作 jQuery 提供了多种方法来处理字符串,尽管原生 JavaScript 已经具备强大的字符串处理能力,但结合 jQuery 可以更方便地操作 DOM 元素中的字符串内容。…

jquery 返回

jquery 返回

jQuery 返回顶部功能实现 使用jQuery实现返回顶部功能可以通过监听滚动事件和动画滚动效果来完成。以下是几种常见的实现方法: 监听滚动事件并显示/隐藏返回按钮 $(window).scro…