Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/backbone.js/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用添加的属性或id对下拉列表进行排序_Javascript_Jquery_Html - Fatal编程技术网

Javascript 使用添加的属性或id对下拉列表进行排序

Javascript 使用添加的属性或id对下拉列表进行排序,javascript,jquery,html,Javascript,Jquery,Html,目前,我在一个网站上工作,我无法访问下拉列表中的perl生成选项。下拉列表是动态填充的,并非所有用户都可以使用所有选项 这里显示了我能够使用的代码 <select class="fielddrop" name="PRIMARY_POS" size="1" style="width: 187px;" ></select> 初级位置 填充每个可以选择的选项 页面呈现时看到的实际输出是 <select class="fielddrop" name="PRIMARY_

目前,我在一个网站上工作,我无法访问下拉列表中的
perl
生成选项。下拉列表是动态填充的,并非所有用户都可以使用所有选项

这里显示了我能够使用的代码

<select class="fielddrop" name="PRIMARY_POS" size="1" style="width: 187px;" ></select>

初级位置 填充每个可以选择的选项

页面呈现时看到的实际输出是

<select class="fielddrop" name="PRIMARY_POS" size="1" style="width: 187px;">

<option value="0">None Selected
<option value="155935">Option4
<option value="155934">Option3
<option value="155905">Option2
<option value="155933">Option1
<option value="155932">Option5   

</select>

未选择
选择4
选择3
选择2
选择1
选择5
我需要能够做的是根据根据文本值指定的隐藏属性设置排序顺序

在上面的例子中。我需要下拉列表(重要的是,它们在页面上有多个下拉列表)能够按照尚未创建的属性进行排序

这样上面的代码就可以

<option value="0">None Selected
<option sortvalue="5" value="155935">Option4
<option sortvalue="4" value="155934">Option3
<option sortvalue="3" value="155905">Option2
<option sortvalue="2" value="155933">Option1
<option sortvalue="1" value="155932">Option5     

</select>
未选择任何
选择4
选择3
选择2
选择1
选择5
根据选项select的文本值设置的sortvalue。因此,将sortvalue 5分配给选项4。仅举一个例子,因为需要指定文本

最终结果应该是下拉列表现在有一个自定义属性Sortvalue,而选择下拉列表现在按该值排序


再一次,我不能直接更改属性,但可以操纵结果。希望这很容易理解,我对此表示怀疑://

通常的做法是在“添加的属性”前面加上
数据。如果我理解正确的话,您可以在jQuery中尝试类似的方法

小提琴示例:


您可以创建一个对象,其中键为文本,值为排序顺序。然后在选项上循环并基于该贴图添加属性

var optsMap = {
  "Option4": 5,
  "Option5": 1
   ......
};

var $select =  $('select[name=PRIMARY_POS]')

$select.find('option').attr('data-sortvalue', function(){
   return optsMap[$(this).text()] ||0;      
}).sort(function(a,b){
    return +($(a).data('sortvalue')||0) - +($(b).data('sortvalue')||0);
}).appendTo($select);
然后,可以使用以下方法读取值:

$select.change(function(){
   alert($(this).find(':selected').data('sortvalue'));
})
若您只需要排序,而不需要属性,那个么可以删除一个步骤


“我对此表示怀疑”-您确实提出了建议。为什么应将sortvalue 5分配给选项4?逻辑是什么?原因是需要能够根据已填充信息的选项组中的值以外的值对该选项列表进行排序。对于所需的输出,使用value属性不是有效的排序方法。此外,使用字母顺序的li8st也不是正确的排序。将所有文本向下缩放,执行设置
sortvalue
的参数。这还不清楚。还不清楚在sortvalue需要根据下拉列表中的文本设置条件后,您打算如何处理该属性。我相信这部分已经讲清楚了。“根据选项select的文本值设置sortvalue。因此,sortvalue为5将被分配给选项4。只需分配文本样本。然后,sortvalue属性将用于对下拉列表进行排序。这就是分配sortvalue的全部目的。好的。因此,您需要一个哈希映射以及一种读取hashmap进行赋值的方法可能我没有正确地遵循答案。但是,发布的示例中已经填充了数据排序值。我需要一种方法来实际创建项目之间的映射,然后在能够排序之前将该数据排序值插入html。因此,您似乎已经向我展示了使用对于实际的数据排序值,我仍然需要一种有效的方法将代码添加到每个选项中,而没有直接的方法将其添加到选项选项选项中。@David您在问题中说您无法访问生成选项的perl代码,并且需要创建属性。这一点现在更加令人困惑,我不确定您的算法是什么hm用于根据选项文本确定排序值(因为它不是按字母顺序排列的),但我用另一个示例进行了更新,假设您已经有了getSortingValueFromText()函数定义,它应该可以工作。我没有权限访问创建它的perl。但是我知道可以列出的所有可能选项。这就是为什么我说我需要一种有效的方法来链接选项(映射)他们。我在哪里暗示我可以访问perl?谢谢Danl查看。提前感谢你的帮助,这是一个巨大的痛苦。似乎在你和charlietfl的答案之间,这是一个部分解决方案。看到另一个答案,我可以看到我需要能够按照他们指定的方式创建一个映射。好的,尽管我看到了演示在我的环境中似乎不起作用。我需要指出应该以某种方式应用于哪个下拉列表吗?基于用于
$select
的初始选择器。请注意,演示使用非常通用的选择器。答案更明确
var optsMap = {
  "Option4": 5,
  "Option5": 1
   ......
};

var $select =  $('select[name=PRIMARY_POS]')

$select.find('option').attr('data-sortvalue', function(){
   return optsMap[$(this).text()] ||0;      
}).sort(function(a,b){
    return +($(a).data('sortvalue')||0) - +($(b).data('sortvalue')||0);
}).appendTo($select);
$select.change(function(){
   alert($(this).find(':selected').data('sortvalue'));
})