前端,关于下拉选择

select标签构成的下拉框和jquery通过js构建的下拉框用法一样。例如:

html下拉框:

<select id="editState"  class="combobox validatebox" name="dto.baseCode.state" style="width:135px"
    data-options="editable:false,required:true">  
    <option value="1">启用</option> 
    <option value="0" selected>停用</option> 
</select>

js控制的下拉框:

<input id="editDisplayName" class="combobox" name="dto.baseCode.displayName" />  
$('#editDisplayName').combobox({  
     url:$WEB_ROOT_PATH+'/basecode/baseCodeCtrl.htm?BLHMI=findBaseCode&dto.baseCode.codeSystem='+diseaseCategory,
     valueField:'id',  
     textField:'text',
     disabled:true,
     onLoadSuccess:function(){
        $CommonUI.getComboBox('#editDisplayName').combobox("setText",row.displayName);
        $CommonUI.getComboBox('#editDisplayName').combobox("setValue",row.displayName);
      }
});

两者的本质是相同的,但是,select标签创建的下拉框会默认选中第一个选项。而js控制的下拉框默认是不会选中任何选项的。
当然select标签的默认选项可以通过为option标签添加selected属性设置。
而js控制的下拉框可以通过$("id").combobox('setValue',value);设置初始值。
下拉框的默认值的获取方式:
$("id").next().children(":text").val()或者$("id").combobox("getValue").


遇到的问题是:下拉框默认选中第一个,但是没有触发选中时候的相应事件。

解决方法: onchange从这个名称就可以看出,只有在select的选项有改变(change)的时候才会触发这个事件的。一般情况下select的第一个选项是默认选项,当你选中第一个项时,由于值没有改变,所以是不会触发onchange事件的。解决这个问题并没有什么完美的办法,一般你可以增加一个空值的项作为第一选项,比如<option>请选择</option>,这样原来的第一项就变成了第二项,点击该项值就有所改变了,就会触发onchange事件了;或者把除第一项外的其他项设为默认值,这样点击第一项也会触发事件的。


©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 背朝着草原 你越走越远 丢弃了羊鞭 遗忘了牧歌 背朝着帐篷 你走越远 松开了缰绳 卸下了马鞍 背朝着经幡 你越走越...
    雪域追梦阅读 247评论 0 1
  • 不必付出,所以就不会疼痛,难过。 还是难过。 饿着睡去,饿着醒来。
    一介2022阅读 155评论 0 0
  • ——《9+几》课堂片段 第一个环节,9+2。孩子们借助小棒,自己动手摆一摆,摆出一个9,再摆出一个2,有的孩子用数...
    阳光绿阅读 570评论 0 0
  • 原创日记(80)2017.5.7 晴 日记记录我生活的婆婆妈妈。 幸福生活黑茶永相伴! 又到了这个令好多人尴尬的季...
    黑金公主阅读 463评论 2 2

友情链接更多精彩内容