要在选择下拉框的选项为 “01” 时插入一段文本,你可以通过 JavaScript 动态创建一个文本节点,并将其添加到页面中。下面是如何实现这一功能的示例代码:
self.Allocation.addChangeHandler(function() {
let value = self.Allocation.getValue(); // 获取金额分配类型
// 清除之前插入的文本(如果存在)
const existingMessage = document.getElementById('allocation-message');
if (existingMessage) {
existingMessage.remove();
}
// 根据value值执行相应操作
if (value.indexOf('06') > -1) {
self.hideChooseUse();
self.showImportCase();
} else {
self.showChooseUser();
self.hideImportCase();
}
// 根据不同的value值执行不同的日志打印
if (value === '01') {
console.log("~01010~");
// 创建并插入提示信息
const message = document.createElement('div'); // 创建一个div元素用于显示消息
message.id = 'allocation-message'; // 设置ID以便于后续查找和删除
message.innerText = "您选择了01,请注意相关事项."; // 设置显示内容
// 将消息插入到下拉框后面或下方
self.Allocation.element.parentNode.insertBefore(message, self.Allocation.element.nextSibling);
} else if (value === '02') {
console.log("~020202~");
} else if (value === '03') {
console.log("~030303~");
}
// 显示百分比时才调用金额接口
if (self.init.devideType === 'BatchAllocation' && !self.init.isRecordSelected) {
self.getNumAndAmount();
}
});
说明:
- 清除已有消息:在每次更改下拉框时,首先检查是否已经有插入的消息,如果存在则移除它。
- 创建新元素:当选择
01
时,会动态创建一个新的<div>
元素来显示提示信息。 - 插入位置:使用
insertBefore
方法将新创建的消息元素插入到下拉框之后。
确保替换 self.Allocation.element
为你实际使用的 DOM 元素。如果需要更多样式或其他自定义设置,可以在创建 message
变量后对其进行调整。
内容由零声教学AI助手提供,问题来源于学员提问