下拉列表选项值和名称与数组javascript

Question

I'm having trouble with array in javascript. Is it possible to insert name and value in the same array

here is my code for array

press=new Array('T shirt black - $23','Sweater black - $34','Hoodie shirt black - $87');

and here is what I want to be the output

<option value="23">T shirt black - $23</option>

how can I put the "23" in the array?

Here is the full code. Sorry if I can't explain it

http://jsfiddle.net/V64hb/1/

http://pastebin.com/zyiQGHTS

Answer 1

You can use an array of objects:

press = [
    { desc: 'T shirt black',
      price: 23
    },
    { desc: 'Sweater black'
      price: 34
    },
    { desc: 'Hoodie shirt black'
      price: 87
    }
];

You can then access them with press[i].desc and press[i].price .

press.forEach(function(item) {
    $('#item').append($('<option/>', {
        value: item.price,
        text: item.desc+' - $'+item.price
    }));
});

Here's the full rewrite of your fiddle. I also got rid of eval() , by putting all the different arrays into an object keyed off the category value.

$(document).ready(function () {
    dropdowns = {
        web: [
            {desc: "1 Custom Web Page", price: 39},
            {desc: "5 Custom Web Pages", price: 190},
            {desc: "10 Custom Web Pages", price: 375},
            {desc: "20 Custom Web Pages", price: 710}
        ],
        art: [{desc: '300-word Article x 1', price: 7.00},
              {desc: '300-word Article x 5', price: 32.00},
              {desc: '400-word Article x 1', price: 8.00},
              {desc: '400-word Article x 5', price: 37.00},
              {desc: '500-word Article x 1', price: 9.00},
              {desc: '500-word Article x 5', price: 40.00},
              {desc: '700-word Article x 1', price: 12.00},
              {desc: '700-word Article x 5', price: 57.00},
              {desc: '1000-word Article x 1', price: 15.00},
              {desc: '1000-word Article x 5', price: 70.00}],
        blog: [{desc: '300-word Custom Blog x 1', price: 10},
               {desc: '400-word Custom Blog x 1', price: 12},
               {desc: '500-word Custom Blog x 1', price: 14},
               {desc: '300-word Custom Blog x 5', price: 47},
               {desc: '400-word Custom Blog x 5', price: 55},
               {desc: '500-word Custom Blog x 5', price: 63}
              ],
        press: [{desc: '300-word Custom Press Release', price: 27},
                {desc: '400-word Custom Press Release', price: 37},
                {desc: '500-word Custom Press Release', price: 47}
               ]
    }

    populateSelect();

    $(function () {
        $('#cat').change(populateSelect);
    });

    function populateSelect() {
        var cat = $('#cat').val();
        $('#item').empty();

        dropdowns[cat].forEach(function(item) {
            $('#item').append($('<option/>', {
                value: item.price,
                text: item.desc+' = $'+item.price
            }));
        });
    }

});

DEMO

Answer 2

The simplest way is for me, spliteach entry uing entry.split('-')[1]; . After that the entry will be $23 . Trim it (using entry.trim() , and get the substring from the second character. This will remove the $.

Answer 3

You could potentially use an array of objects (PHP uses associative arrays for this; these are also referred to as hash maps, and by many other names in many other different languages):

Here's the jsfiddle :

var clothing = [

    {
         type: 't-shirt',
         color: 'black',
         price: 23
    },

    {
         type: 'sweater',
         color: 'black',
         price: 34
    }

]

var i, len = clothing.length;

for (i=0; i<len; i++) {
    var obj = clothing[i];

    console.log('object at index ' + i + ' of clothing array - ');

    for (key in obj) {
        console.log(key + ':' + obj[key]);
    }
}

OUTPUT:

object at index 0 of clothing array -
type:t-shirt
color:black
price:23

object at index 1 of clothing array -
type:sweater
color:black
price:34

Answer 4

you can use split function if array string in same as array and only you want output.

clothing=new Array('T shirt black - $23','Sweater black - $34','Hoodie shirt black - $87');


for (i=0; i<clothing.length; i++) {
    var a = clothing[i].split(" - ");
    $('#item').append('<option value = "'+a[1]+'">'+a[0]+'</option>');
}

http://jsfiddle.net/nilesh026/6qg8C/1/