在jquery/javascript中用分数对select进行排序
Sorting a select with fractions in jquery / javascript
我想根据计算的分数值对以下选择选项进行排序,不包括--please select--选项。
<select class="wpsc_select_variation">
<option value="0">-- Please Select --</option>
<option value="13">1"</option>
<option value="21">2''</option>
<option value="11">3/4"</option>
<option value="6">3/8"</option>
<option value="10">5/8"</option>
<option value="17">1-1/2''</option>
<option value="15">1-1/4''</option>
<option value="19">1-3/4''</option>
<option value="7">1/2"</option>
</select>
到目前为止,我整理的代码:为了简洁和历史起见,添加到pastebin中。
链接
这将解释音符1数组的长度为3。但为什么是3?为什么不是9点?为什么Chrome显示完整的数组,但长度仍然为3,而Firefox在单击父+后显示完整的阵列,但父显示undefined,option,option?
困惑。。。
编辑:编辑以允许多个选择框:如果我错了,请纠正我。
$(".wpsc_select_variation").each(function(index, element){
$($(element).children().get().sort(function (a, b) {
return parseInt(a.value) - parseInt(b.value);
})).appendTo($(element));
});
使用对象进行的最新编辑。如下:
var els = new Array();
var counter = 0;
$j("select.wpsc_select_variation option").each(function(index, ele){
var obj = new Object;
var i = $j(ele).text();
i = i.replace("'"", "");
i = i.replace("''", "");
if (i.indexOf("-") >= 0){
i = i.split('-');
split = i[1].split('/');
i = eval(i[0]) + split[0] / split[1];
}
else if(i.indexOf("/") >= 0){
split = i.split('/');
i = split[0] / split[1];
}
i = eval(i);
obj.ind = i;
obj.ele = ele;
els[counter] = obj;
counter++;
});
els.sort(function (a, b) { return parseInt(a.ind) - parseInt(b.ind) });
console.log(els);
以上结果为:
[Object { ind=NaN, ele=option}, Object { ind=0.75, ele=option}, Object { ind=0.375, ele=option}, Object { ind=0.625, ele=option}, Object { ind=0.5, ele=option}, Object { ind=1, ele=option}, Object { ind=1.5, ele=option}, Object { ind=1.25, ele=option}, Object { ind=1.75, ele=option}, Object { ind=2, ele=option}]
它似乎在对它们进行一些排序,但正如你所看到的,它们仍然不正常。
由于选项值已经在您需要的顺序中,您可以对它们进行排序:
$($(".select_variation option").get().sort(function (a, b) {
return parseInt(a.value) - parseInt(b.value);
})).appendTo(".select_variation");
下面的jsfiddle解决了这个问题。这要归功于ExplosionPills的全面帮助,以及Kolink帮助我发现更多关于数组的信息。感谢vol7ron:
将jquery对象数组转换为html,以获得他对函数的帮助。谢谢大家!
function sortByRationalValue (a,b){
return a.rationalValue - b.rationalValue;
}
function returnObjectFromMeasurements(element, text) {
var obj = {},
range = text.replace(/["'”″]/g, '').split('-'),
rational;
if (range.length > 1)
rational = eval(range[0]) + eval(range[1]);
else
rational = eval(range[0]);
obj.rationalValue = rational;
obj.element = element;
return obj;
}
jQuery(document).ready(function( $ ) {
$(".wpsc_select_variation").each(function (index, element) {
var els = new Array();
var counter = 0;
var children = $(element).children();
$(children).each(function (index, ele) {
els[index] = returnObjectFromMeasurements(ele, $(ele).text());
});
els.sort(sortByRationalValue);
var elements = new Array();
$.each(els, function (index, value) {
elements[index] = value.element;
});
$(this).html(elements);
});
});
http://jsfiddle.net/vwWJ3/5/
相关文章:
- JavaScript数组排序(函数)用于对表行进行排序,而不是排序
- jquery点击函数select&取消选择
- 使用promise和mongoose对文档进行排序
- 在html Select中添加搜索
- Selectize.js:如何对整数值的选项进行排序
- Javascript排序的图像弹出窗口..可以't单独弹出
- Jquery:未触发select事件
- 如何在PHP中使用$_POST获取Select元素值
- 如何通过引用var Using DataTables来进行分页或排序
- 无法在Ionic select中预先选择最后一个选项
- 为什么HTML5拖放的目标是孩子?(可排序列表)
- Dojo:访问dijit.form.Select中单击的项目
- AngularJs对所有页面中的所有记录进行排序
- 当属性不一致时,如何根据属性对JS对象列表进行排序
- 按从高到低对多个int变量进行排序
- HTML-用十进制值对select进行排序
- Bootstrap-select with selected on top和jQuery可排序集成
- 在jquery/javascript中用分数对select进行排序
- 使用 jQuery TableSorter 对包含下拉 (SELECT) 标记和美元符号 ($) 的列进行排序
- 如何使用jQuery对动态生成的SELECT元素中的数据进行排序?