https://zhidao.baidu.com/question/299628455.html

这个问题包含两个方面:jquery选择器(即针对你指定的那个input元素)和获取内容(即获得输入的值),所以综合起来有如下代码可以实现

$("input#test").val();         // 推荐这种方式,因为id是唯一的
$("input[name='test']").val(); // 此时需要注意是否有同名的input元素
$("input:text").val();         // 这种方式只有整个网页只有一个文本输入框才是正确的

下面给出示例:

  1. 创建一个文本框和一个触发获取文本框输入内容的按钮

  • <input id="test" name="test" type="text"/>
    <input type="button" value="显示文本框输入内容">
  • 简单设置一下css样式

  • input[type='text']{width:200px;height:35px;margin:10px;border:1px dashed green; border-radius:5px;}
    input[type='button']{width:200px;height:35px;margin:10px;border:2px solid #ebbcbe;}
  • 添加jquery代码

  1. $(function(){
        $("input:button").click(function() {
            alert($("input#test").val());
        });
    })
  2. 观察显示效果

24

评论(1)

分享

举报

Jquery 选择html 标签获取值的更多相关文章

  1. jQuery 的三种获取值的方式

    本节内容主要介绍的是如何使用jQuery中的.html(),.text()和.val()三种方法,用于读取,修改元素的html结构,元素的文本内容,以及表单元素的value值的方法.jQuery中为我 ...

  2. 前端 s 标签获取值

    1.  s标签获取action中的值: <s:property value="#parameters.mySessionPropKey"/> or <s:prop ...

  3. Struts2-使用forEach标签+el标签获取值栈数据

    import cn.web.body.User; import com.opensymphony.xwork2.ActionSupport; import java.util.ArrayList; i ...

  4. h5 datalist标签获取值

    今天使用datalist标签时,想要获得选中的值,发现使用datalist标签上的val()输出结果一直都是空的 后面改用配套的input获得值 代码如下 <!DOCTYPE html> ...

  5. jquery checkbox全选 获取值

    <style> table { line-height:35px; }</style> <div align="left" style="m ...

  6. jquery 封装页面之间获取值

    最近在项目中发页面传值比较繁琐.View →  Control → View,或是Session.Cookie 的 感觉不是很好,于是封装了一个页面间的js方法,上码 $.extend({ reque ...

  7. jquery 选择标题标签

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  8. 6、前端--DOM操作(查找标签、节点操作、获取值操作、class操作、样式操作、绑定事件、内置参数this)

    DOM操作之查找标签 前缀关键字>>>:document # 基本查找(核心) document.getElementById 根据ID获取一个标签 document.getElem ...

  9. Firefox、Edge下无法使用jQuery的css("margin")、css("padding”)和css("border")获取值

    今天遇到了浏览器的迷惑行为,在Edge上使用jQuery的css("margin")获取值,发现获取的是空值,换了Firefox也是如此.看了jquery官方原话,发现如下一段话R ...

  10. JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参

    <script src="jquery.min.js" type="text/javascript"></script> <scr ...

随机推荐

  1. Python复制单个文件为多个脚本

    编写背景: 由于线上用户反馈媒体添加页加载时间很长,猜测是由于本地视频/图片数量过多引起,于是编写此脚本以便快速生成大量测试视频 代码如下: # coding=utf-8 import os impo ...

  2. Spring解决创建单例bean,而存在线程不安全问题,的解决方案

    一.线程安全问题都是由全局变量.静态变量和类的成员变量引起的.若每个线程中对全局变量.静态变量和类的成员变量只有读操作,而无写 操作,一般来说,这个全局变量是线程安全的,反之线程存在问题 二.因为Sp ...

  3. 如何在Uniapp项目中引入uni_modules中的依赖?

    在Uniapp项目中引入uni_modules中的依赖分为以下几种情况: 对于通用组件: 如果你已经通过HBuilderX插件市场安装了某个uni_modules组件,通常只需在页面的.vue文件中按 ...

  4. Java Objects.equals(a,b)的说明

    一:值是null的情况: a.equals(b), a 是null, 抛出NullPointException异常. a.equals(b), a不是null, b是null, 返回false Obj ...

  5. <HarmonyOS第一课10>ArkUI进阶#鸿蒙课程##鸿蒙生态#

    课程介绍 <HarmonyOS第一课:ArkUI进阶>是专为HarmonyOS开发者设计的课程,旨在提升开发者在ArkUI框架中的布局技能.课程将重点讲解如何进行布局性能优化,包括精简节点 ...

  6. Python基础 - 微线程

    也是多任务系列哦, 进程, 线程, 微线程, 这样一来, 对于多任务这个话题, 应该算是有所涉猎了吧. 我也不怎用其实. 微线程, 就是在 单线程的前提下, 完成多任务, 多任务按照一定顺序交替执行. ...

  7. WPF学习问题汇集:

    WPF中ItemsSource改变,DataGrid中不更新 需要将ItemsSource先赋值为null,而后再赋值为新的值. 例如: gridBeamInfo.ItemsSource = null ...

  8. Array, Set, Map知多少?

    Array,Set和Map三个作为Javascript中可迭代的集合数据类型,在编程过程中使用的频率也比较高.针对三种数据类型各自的一些特性,本文的内容将从以下几个方面来上述数据类型做一个总结. 实例 ...

  9. 利用 SSE 实现流式 AI 聊天交互(三)

    在 AI 赋能的时代,即时交互式对话体验成为众多应用的核心功能之一.本文将介绍如何使用 流式 SSE (Server-Sent Events) 技术,实现高效的 AI 聊天交互,提供更加丝滑的用户体验 ...

  10. python代码片段

    输入分钟.秒,输出格式为:  hh:mm:ss 代码实现: import datetime def convert_to_hh_mm_ss(minutes, seconds): total_secon ...