弹窗底部的取消和确认的按钮如何隐藏
步骤一:确定弹窗的唯一标识
你需要知道你的弹窗对应的单据编码(billno)。这个信息通常在调用弹窗的cb.loader.runCommandLine代码中指定。例如,在文档示例中,单据编码是 'ContractInformationTestList' 或 'ContractInformationList'。
步骤二:编写并注入CSS样式
你需要创建一个函数来动态添加CSS样式规则,并在弹窗打开后(或页面加载后)执行该函数。样式规则需要精确匹配到“确认”和“取消”按钮的CSS选择器。
核心代码示例(基于V3R6和BIP5版本):
bash
// 1. 定义加载样式的通用函数
function loadStyle(cssRule) {
var head = document.getElementsByTagName('head')[0];
var style = document.createElement('style');
style.type = 'text/css';
head.appendChild(style);
// 将CSS规则插入样式表
if (style.sheet) {
style.sheet.insertRule(cssRule, 0);
}
}
// 2. 在弹窗打开后或页面初始化后调用
// 假设你的单据编码是 'YourBillNoList'
// V3R6版本参考:通过按钮的ID进行隐藏
loadStyle('.wui-modal-footer .wui-button#YourBillNoList\|btnModalConfirm {display:none;}'); // 隐藏确认按钮
loadStyle('.wui-modal-footer .wui-button#YourBillNoList\|btnModalCancel {display:none;}'); // 隐藏取消按钮
// BIP5版本参考:通过fieldid属性进行隐藏
loadStyle('.wui-modal-footer .wui-button[fieldid="YourBillNoList|btnModalConfirm"] {display:none;}');
loadStyle('.wui-modal-footer .wui-button[fieldid="YourBillNoList|btnModalCancel"] {display:none;}');
bash
代码说明:
YourBillNoList 需要替换为你实际的单据编码。
btnModalConfirm 和 btnModalCancel 是框架为确认、取消按钮生成的固定字段名。
\| 是CSS中对管道符|的转义(V3R6 ID选择器需要)。
确保这段代码在弹窗的DOM元素渲染后执行。通常可以放在弹窗页面的onLoad事件、父页面的弹窗打开回调事件中,或者使用setTimeout确保DOM已加载。
步骤三:执行时机
为了确保样式生效,建议在以下时机执行上述代码:
在弹窗页面本身的onLoad或afterInit事件中:如果你能修改弹窗页面的脚本。
在打开弹窗的父页面脚本中,监听弹窗打开事件:通过事件回调在弹窗打开后注入样式。
使用setTimeout延迟执行:如果无法精确捕获事件,可以设置一个短暂的延迟。
示例:在父页面打开弹窗后隐藏按钮
bash
viewModel.on('某个打开弹窗的事件', function(){
// 打开弹窗的代码...
cb.loader.runCommandLine('bill', {...}, viewModel);
// 延迟执行,确保弹窗DOM已渲染
setTimeout(function(){
loadStyle('.wui-modal-footer .wui-button[fieldid="YourBillNoList|btnModalConfirm"] {display:none;}');
loadStyle('.wui-modal-footer .wui-button[fieldid="YourBillNoList|btnModalCancel"] {display:none;}');
}, 300); // 延迟300毫秒
});
bash
⚠️ 注意事项
版本差异:务必区分你使用的是V3R6还是BIP5(及更高版本),选择对应的CSS选择器写法。选择器错误将导致样式不生效。
单据编码:YourBillNoList 必须替换为你实际弹窗的单据编码,否则无法定位到正确的按钮。
执行时机:CSS样式必须在弹窗的DOM元素(特别是底部按钮栏)渲染完成后注入才能生效。过早执行会找不到元素。
样式作用域:此方法添加的是全局样式,可能会影响到页面上其他同类型元素。请确保你的选择器足够精确(通常通过单据编码限定)。
按钮功能:隐藏按钮后,弹窗将无法通过点击“确认”提交或“取消”关闭。你需要确保业务逻辑中有其他方式(如弹窗内自定义按钮、点击遮罩层关闭等)来处理这些操作,否则弹窗可能无法关闭。
浙公网安备 33010602011771号