我工作的HTML表单上的定制要求。 这是个人项目，我不想用现成使用的插件。
我在这里把我所有的代码，并需要你让我越来越严重的问题的一个帮助。 首先，让我们看看我有下面的代码这样做的远！
我做了什么至今：我已选择-内部HTML表单OPTION结构。 我写了自定义的功能相同的转换成UL - 李结构保持与SELECT相同的功能 - 选择，而提交表单。
最重要的是选项标记的价值属性。 我把自定义属性“数据选择”这样的计算。
QUERY：我现在面临的一个问题，同时提交与页面上的多个选择的形式（后转换成结构UL-LI）。
分析：
虽然默认试图选择 - 选项的结构，我得到下面附加的表单提交的URL，而不从多个下拉菜单中更改任何值的参数。
https://www.google.com/?abc=1&def=1&xxx=1。 而且你可以在后面的URL看到“？” 存在与这是默认选择的值的默认值“1”来NAME属性。现在用我的函数（SELECT-OPTIONS转换成UL-LIS）后，我下面＃1，我发现虽然我们并没有改变从下拉列表中值它的行为不端。 如果我提交表单，而不改变从下拉菜单抵达这个参数附加到URL中的价值。 恳请在＃1本>>比较URL
https://www.google.com/?abc=0&def=0&xxx=0。 这里选择了默认已通过配置通过。<script>$('select').customSelect({selected: '2',alignRight: 'true'});</script>配置参数“ 中选择了 ”给定值“2”。 因此，在默认情况下第二个李应选择，如果我们不从价值下拉“0”（零）在＃2的URL改变来代替。
我需要帮助来获取默认值！
下面是2个的代码片段和
HTML
<form method="get" action="http://google.com">
<select name="abc">
<option value="1">first</option>
<option value="2">second</option>
<option value="3">third</option>
</select>
<br><br><br><br><br><br>
<select name="def">
<option value="1">first</option>
<option value="2">second</option>
<option value="3">third</option>
</select>
<br><br><br><br><br><br>
<select name="xxx">
<option value="1">first</option>
<option value="2">second</option>
<option value="3">third</option>
</select>
<input type="submit" value="submit">
</form>
<script>
$('select').customSelect({
selected: '2',
alignRight: 'true'
});
</script>
JS
(function ($) {
$.fn.customSelect = function( options ) {
var settings = $.extend({
//mainWidth: '200',
selected: '0',
alignRight: 'false',
}, options );
return this.each(function() {
var el = $(this);
var name = el.prop('name');
var optionTag = el.children();
var wrapperDIV = $('<div class="customSelect"/>');
var newDIV = $('<div class="custom-select"/>');
var inputTag = $("<input name='"+name+"' type='text' readonly='readonly' />").hide();
var inputDummy = $("<div class='input-dummy'/>");
var valueHolder = $('<div class="value-holder clearfix"/>');
var ULTag = $('<ul class="clearfix"/>');
var spanTag = '<span/>'
el.wrap(wrapperDIV);
el.parent().append(newDIV);
newDIV.append(valueHolder);
valueHolder.append(spanTag);
valueHolder.append(inputTag);
valueHolder.append(inputDummy);
newDIV.append(ULTag);
optionTag.each(function(){
ULTag.append("<li data-selected='"+$(this).val()+"'>"+$(this).text()+"</li>");
}).end().remove();
var valDefault = $('li').eq(settings.selected - 1).val();
var textDefault = $('li').eq(settings.selected - 1).text();
$(inputTag).val(valDefault);
$(inputDummy).text(textDefault);
valueHolder.click(function(){
$(this).next().toggle();
});
ULTag.each(function(){
$('li',this ).click(function(){
$(this).each(function(){
$(this).addClass('active').siblings().removeClass('active');
var x = $(this).data('selected');
var y = $(this).text();
$(inputTag).val(x);
$(inputDummy).text(y);
$(this).parent().hide();
});
});
});
if(settings.selectorRight == 'true'){
inputDummy.css('float', 'right');
//valueHolder.css('float', 'right');
}
else{
inputDummy.css('float', 'left');
//valueHolder.css('float', 'left');
}
var woVH = valueHolder.width();
inputDummy.width(woVH-20);
ULTag.width(woVH);
});
};
}( jQuery ));
的jsfiddle
