this.options[selectedIndex]的使用

<select id="sel" onchange="javascript:getSelect();">
<option value="a">选择</option>
<option value="bdd">be</option>
<option value="c">ce</option>
<option value="d">de</option>
<option value="e">ee</option>
</select>
<script>
function getSelect() {
   //得到select下拉列表中option的value
   var optionValue = document.getElementById("sel").options[document.getElementById("sel").options.selectedIndex].value;
   //得到select下拉列表中option的text
   var optionText = document.getElementById("sel").options[document.getElementById("sel").options.selectedIndex].text; 
}
</script>

<select id="sele" onchange="javascript:getE();">
<option value="monday">星期一</option>
<option value="tuesday">星期二</option>
<option value="wednesday">星期三</option>
<option value="thursday">星期四</option>
<option value="friday">星期五</option>
</select>
<script>
function getE() {
   //我建议这里也像下面一些写,虽然这样写也可以获得数据
   var optionsValue = document.getElementById("sele").value;
   alert(optionsValue);
   var optionsText = document.getElementById("sele").options[document.getElementById("sele").options.selectedIndex].text;
   alert(optionsText);
}
</script>

// components/modal/modal.js const modalService = require('../../utils/modalService'); const app = getApp(); Component({ properties: { modalVisible: Boolean, modalType: String, modalTitle: String, modalData: Object, modalConfig: Object }, data: { optionsCache: {}, // 缓存各字段的选项数据 selectedIndices: {}, // 各选择字段的选中索引 selectedItems: {} // 各选择字段的选中项 }, methods: { // 模态框取消处理 handleModalCancel() { modalService.handleCancel(); }, // 模态框确认处理 handleModalConfirm() { modalService.handleConfirm(); }, // 统一的字段输入处理函数 onFieldInput(e) { const fieldName = e.currentTarget.dataset.field; this.triggerEvent('update', { path: `modalData.${fieldName}`, value: e.detail.value }); }, // 统一的选择器变更处理函数 onFieldSelect(e) { const fieldName = e.currentTarget.dataset.field; const optionsKey = e.currentTarget.dataset.options; const options = this.data.optionsCache[optionsKey] || []; const selectedItem = options[e.detail.value]; this.setData({ [`selectedIndices.${fieldName}`]: e.detail.value, [`selectedItems.${fieldName}`]: selectedItem }); this.triggerEvent('update', { path: `modalData.${fieldName}`, value: selectedItem.value }); }, // 统一的复选框处理函数 onFieldCheck(e) { const fieldName = e.currentTarget.dataset.field; this.triggerEvent('update', { path: `modalData.${fieldName}`, value: !this.data.modalData[fieldName] }); }, // 统一的创建按钮处理函数 onCreateItem(e) { const config = e.currentTarget.dataset.config; const fieldName = e.currentTarget.dataset.field; modalService.openChildModal(config.modalType, {}, (newItem) => { if (newItem) { // 刷新选项数据 this.loadOptionsForField(fieldName); // 自动选中新创建的项 const options = this.data.optionsCache[fieldName] || []; const newIndex = options.findIndex(opt => opt.value === newItem.id); if (newIndex >= 0) { this.setData({ [`selectedIndices.${fieldName}`]: newIndex, [`selectedItems.${fieldName}`]: options[newIndex] }); this.triggerEvent('update', { path: `modalData.${fieldName}`, value: newItem.id }); } } }); }, // 加载字段选项数据 loadOptionsForField(fieldName) { const field = this.data.modalConfig.fields.find(f => f.name === fieldName); if (!field || field.type !== 'select' || !field.options) return; const { dataSource, valueField, displayField } = field.options; const items = app.globalData.dataManager.data[dataSource] || []; const options = items.map(item => ({ value: item[valueField], display: item[displayField], raw: item })); this.setData({ [`optionsCache.${fieldName}`]: options }); // 更新选中项 const currentValue = this.data.modalData[fieldName]; if (currentValue) { const selectedIndex = options.findIndex(opt => opt.value === currentValue); if (selectedIndex >= 0) { this.setData({ [`selectedIndices.${fieldName}`]: selectedIndex, [`selectedItems.${fieldName}`]: options[selectedIndex] }); } } }, // 获取字段的选项数据 getOptions(field) { return this.data.optionsCache[field.name] || []; } }, // 监听modalType变化,加载对应配置 observers: { 'modalType': function(type) { if (!type) return; // 获取模态框配置 const config = modalService.modalTypes[type]; this.setData({ modalConfig: config, optionsCache: {}, selectedIndices: {}, selectedItems: {} }); // 加载所有select类型字段的选项数据 if (config && config.fields) { config.fields.forEach(field => { if (field.type === 'select') { this.loadOptionsForField(field.name); } }); } } } } }, // 监听modalType变化 observers: { 'modalType': function(type) { if (!type) return; // 获取模态框配置 const config = modalService.modalTypes[type]; this.setData({ modalConfig: config, optionsCache: {}, selectedIndices: {}, selectedItems: {} }); // 加载所有select类型字段的选项数据 if (config && config.fields) { config.fields.forEach(field => { if (field.type === 'select') { this.loadOptionsForField(field.name); } }); } } } } });与犯错误,完整文件内容
最新发布
07-28
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值