根据选择的选项重新创建阵列

我需要帮助来解决一个简单的需求。根据选择的选项重新创建阵列

<select id="my-select1"> 
    <option value="1">This is option 1 ({myop1}|OP)</option> 
    <option value="2" selected>This is option 2 ({myop1}|OQ)</option> 
    <option value="3">This is option 3 ({myop1}|OR)</option> 
</select> 
<select id="my-select2"> 
    <option value="1">This is option 1 ({myop2}|PP)</option> 
    <option value="2">This is option 2 ({myop2}|PQ)</option> 
    <option value="3" selected>This is option 3 ({myop2}|PR)</option> 
</select> 
<select id="my-select3"> 
    <option value="1">This is option 1 ({myop3}|QP)</option> 
    <option value="2">This is option 2 ({myop3}|QQ)</option> 
    <option value="3" selected>This is option 3 ({myop3}|QR)</option> 
</select>

查看HTML以上，我想我的重新排列：根据所选的选项

combo = ["abc-{myop1}-{myop2}", "def-{myop2}"];

INTO

combo = ["abc-OQ-PR", "def-PR"];

。

要注意的另一件事是，我不能简单地改变选择框的选项的值，这意味着HTML是有点像它，如果它会帮助，唯一的部分我可以在该HTML重构是之间的文字内容3210

我不知道，但我已经花了几个小时只是为了解决这个问题。也许是由于我有限的jQuery知识。

请帮忙。谢谢

来源

2011-01-20 Marvzz

所以`abc- {myop1} - {myop2}`是一种模板，您想从选择框中“插入”值？ – 2011-01-20 08:14:51

是的，新阵列将基于选择框中的选择。 – Marvzz 2011-01-20 08:19:40

获取所选择的值到关联数组：

var pattern = {}; 
var s = $('select option:selected').each(function(){ 
    var m = /\((.*?)\|(.*)\)/.exec($(this).text()); 
    pattern[m[1]] = m[2]; 
});

然后可以替换每个占位符在每个字符串与相应的值的阵列中：

combo = $.map(combo, function(e){ 
    return e.replace(/\{.*?\}/g, function(m){ 
     return pattern[m]; 
    }); 
});

演示：jsfiddle.net/C97ma/

来源

2011-01-20 08:37:56 Guffa

我想你正在使用javascript来组合这些（它也可以用PHP来完成）.. 你需要引用你的选择，例如，：

<script type="text/javascript"> 
    a=document.getElementById("myselect").options[1]; 
</script>

这将从“myselect”指定第二个选项值选择元素的变量a

来源

2011-01-20 08:25:42 crowicked

根据您所提供的信息，我不明白100％我猜。但无论你想要做什么，我想jQuerys .map()和$.map()会帮助你在这里。

像

var arr = $('select').find('option:selected').map(function(index, elem) { 
    return elem.textContent || elem.text; 
}).get();

演示：http://www.jsfiddle.net/4yUqL/78/

内回调可以修改/匹配任何你想要的/需要的文本。在你的情况下，我可以想象你想用一个正则表达式来匹配选定的字符串并以某种方式重新创建它们。

来源

2011-01-20 08:26:18 jAndy

首先，我首先会改变选择框中的值是这样的：

<select id="my-select1"> 
    <option value="OP">This is option 1 ({myop1}|OP)</option> 
    <option value="OQ" selected>This is option 2 ({myop1}|OQ)</option> 
    <option value="OR">This is option 3 ({myop1}|OR)</option> 
</select> 
<select id="my-select2"> 
    <option value="PP">This is option 1 ({myop2}|PP)</option> 
    <option value="PQ">This is option 2 ({myop2}|PQ)</option> 
    <option value="PR" selected>This is option 3 ({myop2}|PR)</option> 
</select> 
<select id="my-select3"> 
    <option value="QP">This is option 1 ({myop3}|QP)</option> 
    <option value="QQ">This is option 2 ({myop3}|QQ)</option> 
    <option value="QR" selected>This is option 3 ({myop3}|QR)</option> 
</select>

现在更新您的数组：

var comboDef = ["abc-{myop1}-{myop2}", "def-{myop2}"]; 
var combo = ["abc-{myop1}-{myop2}", "def-{myop2}"]; 

function updateArray() { 
    combo = comboDef; 
    for (i in combo) 
    { 
     combo[i] = combo[i].replace("{myop1}",document.getElementById("my-select1").value); 
     combo[i] = combo[i].replace("{myop2}",document.getElementById("my-select2").value); 
     combo[i] = combo[i].replace("{myop3}",document.getElementById("my-select3").value); 
    } 
}

当然可以这样做适当阵列更好（如果你给你的选择框使用document.getElementsByName()可以迭代它们）。基本的想法是replace，尽管我相信你在找什么。

来源

2011-01-20 08:33:07 jcuenod

根据选择的选项重新创建阵列

回答

相关问题