获取具有相同class属性值的按钮id的方法

最新推荐文章于 2024-05-08 10:58:24 发布
最新推荐文章于 2024-05-08 10:58:24 发布
阅读量1.7k 收藏 3
点赞数 3
文章标签： JAVA JS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_37861553/article/details/82177811
版权

需求
昨天boss发了新需求，需求页面中有一项就是做这些个按钮，点击每个按钮展示其对应的内容。
解决思路：一堆小button组成一个大button，当点击小button的时候，会触发大button绑定的事件，在大button事件中获取小button对应的id。

1、
<td class="btntd search" style="height: 30px;" align="left">
    <input type="button" class="a_ht-button" id="todaydiscuss" value="今日讨论">&nbsp;&nbsp;
    <input type="button" class="a_ht-button" id="onemonth" value="1个月">&nbsp;&nbsp; 
    <input type="button" class="a_ht-button" id="threemonth" value="3个月">&nbsp;&nbsp;
    <input type="button" class="a_ht-button" id="sixmonth" value="6个月">&nbsp;&nbsp;
    <input type="button" class="a_ht-button" id="oneyear" value="1年">&nbsp;&nbsp;
    <input type="button" class="a_ht-button" id="twoyear" value="2年">&nbsp;&nbsp;
    <input type="button" class="a_ht-button" id="threeyear" value="3年">&nbsp;&nbsp;
</td>
2、
$(".a_ht-button").click(function(){ 
        var date = $(this).attr('id');//获取小button的id。
        alert(date);//弹出id值看是否正确。把获取的id值通过url传到servlet
});

3、servlet获取date的值并把值向下传递给service。
4、在service中判断传过来的date值属于哪个小button的id值，然后执行相应的程序。

if (!Util.isNullOrEmpty(date)) {
    if("onemonth".equals(date)){
        calendar.add(calendar.MONTH, -1);  //设置为前1月
    }
    if("threemonth".equals(date)){
        calendar.add(calendar.MONTH, -3);  //设置为前3月
    }
    if("sixmonth".equals(date)){
        calendar.add(calendar.MONTH, -6);  //设置为前6月
    }
    if("oneyear".equals(date)){
        calendar.add(calendar.MONTH, -12);  //设置为前12月
    }
    if("twoyear".equals(date)){
        calendar.add(calendar.MONTH, -24);  //设置为前24月
    }
    if("threeyear".equals(date)){
        calendar.add(calendar.MONTH, -36);  //设置为前36月
    }
    String beforeTime = formatter.format(calendar.getTime());
    inMDTBgTime = beforeTime;
    inMDTEndTime = dateString;
    }

5、通过dao.search(inMDTBgTime，inMDTEndTime )方法把值传给DAO层，从数据库中取自己想要的数据

大写的奥特曼
关注
  • 3
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
Button Class(按钮类别)
weixin_44025382的博客
01-20 1万+
代码整理： 1.提供IsPressing信号，让其他模块或后续模块得知目前用户硬件输入状态。 2.OnPressed 信号，提供…目前是否刚刚按下此按钮。 3.OnReleased信号，…目前是否刚刚释放此按钮。 在Assets目录下新建类程式码（MyButton）1.不继承MonoBehavier；写入三种状态以及两种判断状态。 using System.Collections; using S...
python selenium 获取标签的属性值、内容、状态方法
09-20
本文将深入探讨在Python环境下使用Selenium来获取标签的属性值、内容和状态的方法。 首先，获取DOM元素的属性值可以通过Selenium的`.get_attribute()`方法实现。例如，要获取一个元素的`data-original-title`属性，...
selenium 同样的class如何选择第二个
最新发布
Java萌新
05-08 440
【代码】selenium 同样的class如何选择第二个。
Webbrowser获取<button>标签的class的值
u010063461的专栏
05-22 1826
//测试按钮 private void button2_Click(object sender, EventArgs e) { try { HtmlElementCollection Input = webBrowser1.Document.GetElementsByTagName("b
JS获取指定类名下的input/div/button等特定元素
竹了的博客
12-11 5147
<body> <!-- 获取指定类名下的所有input元素 --> <div class="aCuteName"> <div></div> <input type="text" value='1'> <input type="text" value='2'> <ul> <li>3</.
前端选取多个相同class标签的值
qq_45473377的博客
07-15 843
<div class="textbox02"> <foreach name="conf_list" item="vos"> <p><input type="checkbox" class="config" name="config" value="{$vos.cf_id}" >{$vos.content} 　　　　　　<span>{$vos.price}</span>元 　　　　　　</p> 　　　
如何获取被点击按钮所在的当前行和类名
iteye_18777的博客
08-07 3166
       有时候当点击页面表格中的按钮时可能需要获取该按钮所在当前行的信息以及给按钮添加点击事件时可能需要获取该按钮的类名，下面就是获取的方法。                                                                                图片1   //给图片1的加减按钮添加点击事件 function addButt...
jquery attr()设置和获取属性值实例教程
11-23
它允许开发者方便地获取或设置元素的属性值。本教程将详细讲解 `attr()` 方法的四种主要用法，并通过实例来展示其功能。 1. **获取属性值**： 当只传递一个参数（属性名）给 `attr()` 方法时，它会返回第一个匹配...
Repeater中添加按钮实现点击按钮获取某一行数据的方法
09-04
在上述代码中，我们首先通过e.CommandArgument获取到按钮点击时传递的E_ID值，然后根据CommandName判断是编辑操作还是删除操作。如果是删除，我们创建一个BLL_Emp实例，调用其Delete方法，传入E_ID值，然后使用...
Javascript获取标签ID改变style属性的代码
10-27
ID属性的值应当是唯一的，不应该在同一个页面中有多个元素使用相同的ID。 2. JavaScript中的DOM操作： 文档对象模型（DOM）是一个用于HTML和XML文档的编程接口，JavaScript可以通过DOM操作来动态地读取或修改页面的...
button按钮样式美化
01-19
css样式对页面上的button控件进行美化，美化界面效果。
JQuery对class属性的操作实现按钮开关效果
10-26
紧接着，我们在HTML中定义一个超链接标签，这个标签包含了初始的class属性值，用来指定按钮初始时的显示状态。在示例中，初始状态设置为了.controlOff，表示按钮初始时是关闭状态。同时，我们为这个标签添加了一个id...
HTML基础标签 -常用标签、img标签和链接标签
der_alone的博客
09-08 701
HTML常用标签 1）标题标签：h 作为标题使用，有 h1-h6 六个等级 2）段落标签： p 可以把HTML文档分割为若干段落。 3）水平线标签 hr 在网页中显示默认样式的水平线，是一个单标签。 4）换行标签：br 可以使某段文本强制换行显示 5）div和span标签：这两个标签是没有语义的，是网页布局主要的2个盒子。div标签一行只能放一个，span标签一行可以放多个。 6）文本格式化标签 标签 显示 效果 b标签/strong标签 文字以粗体方式显示 i标签/em标签 文字以斜
js搜索相同类型的控件全选、取值（Checkbox）
weixin_30332241的博客
10-17 113
function selectAll(obj) { if (obj.checked) { $("input[type='checkbox']").each(function () { $(this).attr('checked', 'checked'); }); } else { ...
JQuery不同的button如何获得相同class对应的不同DOM内容
weixin_43201090的博客
02-18 544
<script> $(function(){ $("button").click(function(){ var n =$('button').index($(this)) var sellerid = $('span.sellerid:eq('+n+')').text() var ingrename = $('span.ingrename:...
js 在多个按钮中获取点击按钮的id值
PerfectUrl的博客
05-10 4992
window.onload = function(){ var arr = document.getElementsByTagName('button'); for(var i = 0;i<arr.length;i++){ arr[i].onclick = function(){ alert(this.id);//this是关键点 } }
如何给多个按钮设置和获取ID
iteye_18777的博客
08-01 1438
        我用tmpl模板动态生成商品列表，其中用一列添加按钮模板动态生成很多“加入购物车”按钮，当点击该按钮商品会加入购物车，这就需要给这些按钮添加ID，通过ID找到相应的商品信息加入到购物车，具体内容如下： //以下是写在html &lt;head&gt;标签中的tmpl模板： &lt;script type="text/x-jquery-tmpl" id="trPemp"&...
新版selenium定位全部相同class的元素或定位第二个元素的方法
zzzzzzzrr的博客
01-06 4523
老版本的代码会将class为head的元素全部提取并生成一个list。使用新版的selenium时发现网页代码中存在相同的class元素，想全部定位该class下的所有元素。打开html代码后发现有多段class为head的代码，想全部提取用做index name。#此段代码将会返回class为head的元素所组成的list#
jquery获取点击按钮的id
jiaonizuoren的博客
10-25 2802
$("button[id^='btn_']").click(function (e) { var btnId = $(e.target).attr('id'); });
react 点击获取id
08-04
### 回答1： 当用户点击 React 组件时，可以通过事件对象获取该组件的 ID。具体实现方式如下： 1. 在组件的 render 方法中，为组件添加一个 onClick 事件处理函数，如下所示： ``` render() { return ( <div onClick={this.handleClick}>点击我获取 ID</div> ); } ``` 2. 在事件处理函数 handleClick 中，通过事件对象 e 获取当前组件的 ID，如下所示： ``` handleClick(e) { const id = e.target.id; console.log(`当前组件的 ID 是：${id}`); } ``` 这样，当用户点击该组件时，控制台会输出当前组件的 ID。 ### 回答2： React 是一个用于构建用户界面的 JavaScript 库。在 React 中，我们可以通过使用事件处理函数来实现点击获取 id 的功能。 首先，在 React 组件中，我们需要定义一个状态（state）来存储 id 的值。可以使用 useState() 钩子来创建这个状态变量，代码如下： ``` import React, { useState } from 'react'; function MyComponent() { const [id, setId] = useState(''); const handleClick = (event) => { const { id } = event.target; setId(id); } return ( <div> <button id="button-1" onClick={handleClick}>按钮1</button> <button id="button-2" onClick={handleClick}>按钮2</button> <button id="button-3" onClick={handleClick}>按钮3</button> <p>点击的按钮 id 是：{id}</p> </div> ); } export default MyComponent; ``` 在上述代码中，我们定义了一个状态变量 id，并使用 useState() 初始化为空字符串。然后，我们定义了一个 handleClick() 函数，该函数接收一个事件对象作为参数。通过事件对象的 target 属性，可以获取到被点击的按钮元素，进而获取到该按钮的 id。最后，使用 setId() 方法将获取到的 id 值更新到状态变量 id 中。 在组件的 JSX 中，我们创建了三个按钮，并将 handleClick 函数传递给每个按钮的 onClick 属性。当用户点击某个按钮时，React 会自动调用 handleClick 函数，并传入一个事件对象。 最后，我们在一个段落（p）元素中展示了当前点击的按钮 id，通过插值{id}来显示状态变量 id 的值。 这样，当用户点击按钮时，React 会调用 handleClick 函数，将按钮的 id 传递给该函数，并更新组件的状态，从而实现了点击获取 id 的功能。 ### 回答3： 在React中获取点击的元素的id可以通过事件对象的target属性来实现。首先，在组件的render()方法中给需要绑定事件的元素添加一个onClick属性，将其绑定到一个处理点击事件的函数上，如下所示： ```jsx class MyComponent extends React.Component { handleClick = (event) => { const id = event.target.id; console.log('点击的元素id为：', id); } render() { return ( <div> <button id="button1" onClick={this.handleClick}>按钮1</button> <button id="button2" onClick={this.handleClick}>按钮2</button> <button id="button3" onClick={this.handleClick}>按钮3</button> </div> ); } } ``` 在上述代码中，我们给按钮元素添加了一个id属性来标识不同的按钮，同时将点击事件处理函数handleClick绑定到每个按钮的onClick属性上。 当用户点击某个按钮时，React会调用handleClick函数，并将一个event对象传入该函数。我们可以通过event.target获取到触发点击事件的元素，进而通过target.id获取到其id属性的值。 例如，当用户点击"按钮2"时，控制台会打印出"点击的元素id为：button2"。 需要注意的是，如果在点击事件的处理函数中需要使用组件的状态或方法，需要将处理函数声明为实例方法（使用箭头函数），或者在构造函数中使用bind()方法绑定this。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值