select下拉框点击其中一个内容,触发切换事件

本文介绍了一个基于HTML和JavaScript实现的受捐者信息筛选与展示功能。通过下拉菜单选择受捐状态,并触发搜索功能,展示包括姓名、性别、证件号等详细信息。
部署运行你感兴趣的模型镜像

html:

<div class="form-group" style="display: inline;">

<label>受捐状态</label>

<select class="form-control" name="status"id="status" onchange="$('#op_search').click()">

<option value="0">未接受</option>

<option value="1" selected="selected">已接受</option>

</select>

</div>

js:

<script>

$(document).ready(function() {
$("select").multiselect();
//搜索
$("#op_search").click(function() {
search_name = $("#search_name").val();
search_phone = $("#search_phone").val();
search_cardno = $("#search_cardno").val();
search_status = $("#status").val();
search_code = $("#search_code").val();
beg_date = $("#beg_date").val();
end_date = $("#end_date").val();
search_sex = $("#search_sex").val();
search_nation = $("#search_nation").val();
search_org = $("#search_org").val();
pageRequestImpl(1, _page_pageSize);
});
});

function pageRequestImpl(curpage, pagesize) {
search_status = $("#status").val();
var layer_index = layer.load(); //加载层
$.ajax({
type : "POST",
url : "${ctx}/manager/rr.do?method=",
data : {
page : curpage,
rows : pagesize,
name : search_name,
telphone : search_phone,
cardno : search_cardno,
status : search_status,
code : search_code,
beg_date : beg_date,
end_date : end_date,
sex : search_sex,
nation : search_nation,
org : search_org
},
async : false,
dataType : "json",
success : function(data) {
layer.close(layer_index);
var pg_curpage = data.currentPage;
var pg_totalpage = data.totalPage;
var pg_receiverlist = data.list;
var pg_haseprepage = data.hasPreviousPage;
var pg_hasnextpage = data.hasNexPage;
var str = "";
for (var i = 0; i < pg_receiverlist.length; i++) {
var name = pg_receiverlist[i].name == null ? "" : pg_receiverlist[i].name;
var sex = pg_receiverlist[i].sex == null ? "" : pg_receiverlist[i].sex;
var cardno = pg_receiverlist[i].cardno == null ? "" : pg_receiverlist[i].cardno;
var birthday = pg_receiverlist[i].birthday == null ? "" : pg_receiverlist[i].birthday.substring(0, 10);
var telphone = pg_receiverlist[i].telphone == null ? "" : pg_receiverlist[i].telphone;
var createtime = pg_receiverlist[i].createtime == null ? "" : pg_receiverlist[i].createtime.substring(0, 19).replace("T", "&nbsp;");
//var creater=pg_receiverlist[i].creatername==null?"":pg_receiverlist[i].creatername;
var code = pg_receiverlist[i].code == null ? "" : pg_receiverlist[i].code;
var orderno = pg_receiverlist[i].orderno == null ? "" : pg_receiverlist[i].orderno;
var status = pg_receiverlist[i].status == null ? "" : pg_receiverlist[i].status;
var orgname = pg_receiverlist[i].orgname == null ? "" : pg_receiverlist[i].orgname;
str += "<tr>";
str += "<td>" + ((i + 1) + (pagesize * (curpage - 1))) + "</td>";
str += "<td><input type='checkbox'  name='checkself' value='" + pg_receiverlist[i].id + "'  onclick='checkselfClick();' ></td>";
str += "<td><a onclick='goDetail(" + pg_receiverlist[i].id + ");' href='#'>" + name + "</a></td>";
if (sex == 0) {
str += "<td>未知</td>";
}
if (sex == 1) {
str += "<td>男</td>";
}
if (sex == 2) {
str += "<td>女</td>";
}
str += "<td>" + code + "</td>";
str += "<td>" + cardno + "</td>";
str += "<td>" + birthday + "</td>";
str += "<td>" + telphone + "</td>";
str += "<td>" + createtime + "</td>";
str += "<td>" + orgname + "</td>";
//str += "<td>" + creater + "</td>";
if (status == 0) {
str += "<td>未接受</td>";
}
if (status == 1) {
str += "<td>已接受</td>";
}
str += "<td>第" + orderno + "名</td>";
str += "</tr>";
}
$("#checkall").prop("checked", false); //重新请求后  让复选框复位
$('#tbody').html(str);
pageValue(pg_curpage, pg_totalpage, pg_haseprepage, pg_hasnextpage);
},
error : function() {
layer.alert('网络连接失败!', {
icon : 7
});
}
});
}

</script>

您可能感兴趣的与本文相关的镜像

Llama Factory

Llama Factory

模型微调
LLama-Factory

LLaMA Factory 是一个简单易用且高效的大型语言模型(Large Language Model)训练与微调平台。通过 LLaMA Factory,可以在无需编写任何代码的前提下,在本地完成上百种预训练模型的微调

在 QML 中,你可以通过编写一些简短的 JavaScript 代码来实现当点击某个按钮时自动展开 `ComboBox` 的下拉列表。这通常涉及到对 `ComboBox` 组件的行为进行手动控制。下面是一个完整的示例说明如何达到这个效果: ### 实现步骤 1. **创建布局**:放置两个控件——一个按钮 (`Button`) 和一个组合框 (`ComboBox`)。 2. **设置交互逻辑**:为按钮添加 `onClick` 事件处理器,在该处理器内部调用方法来显示或隐藏 `ComboBox` 下拉菜单。 ### 示例代码 ```qml import QtQuick 2.15 import QtQuick.Controls 2.15 ApplicationWindow { visible: true width: 640 height: 480 title: qsTr("Trigger ComboBox DropDown") Column { anchors.centerIn: parent spacing: 20 // 创建并配置 ComboBox 控件 ComboBox { id: comboBox model: ["Apple", "Banana", "Orange"] placeholderText: "Select a fruit..." // 防止重复打开的情况发生 onPopupVisibleChanged: { if(popupVisible){ console.log("Combo box opened"); } else{ console.log("Combo box closed"); } } } // 创建触发按钮 Button { text: "Show Combo Box Options" onClicked: { console.log("Button clicked!"); // 打开 ComboBox 的弹出层,并立即聚焦它以便能够选择项目 comboBox.popup.visible = !comboBox.popup.visible; comboBox.forceActiveFocus(); } } } } ``` ### 关键点解释: - 使用了 `comboBox.popup.visible = !comboBox.popup.visible;` 来切换 `ComboBox` 弹出窗口的状态(即是否可见)。这是因为默认情况下并没有提供直接的方法去“点击”展开 `ComboBox` ,所以我们需要操作其内部的 Popup 属性。 - 添加了一个日志打印功能到 `onPopupVisibleChanged`, 让我们知道每次状态发生变化的时候发生了什么情况。 - 利用了 `forceActiveFocus()` 函数使得 `ComboBox` 在被激活之后立刻获取焦点,方便用户接下来的操作。 注意这里我们简单实现了开关的效果;如果你只需要单向地从关闭转成开启,则只需移除反转运算符 `!` 并将语句改为 `comboBox.popup.visible = true`. ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值