通过选择选项javascript更改品牌详细信息

默认我想显示所有产品详细信息,我想更改匹配的产品详细信息,如果选项值===产品b_name..显示详细信息


let products = [

        {

            b_name: 'Samsung',

            price: 15000,

            ram: '6GB',

            rom: '128GB',

        },

        {

            b_name: 'Apple',

            price: 65000,

            ram: '6GB',

            rom: '128GB',

        },

{

        b_name: 'LG',

        price: 35000,

        ram: '6GB',

        rom: '128GB',

    },

    {

        b_name: 'Nokia',

        price: 25000,

        ram: '6GB',

        rom: '128GB',

    },

    ];

    

     let _selectBrand =   $('#select_brand');

   let _detailsList = $('#details');

   let brandOptions = '';

    for(let brand of  products){

       brandOptions += `<option value="${brand.b_name}">${brand.b_name}</option>`;

    }

    _selectBrand.append(brandOptions);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div>

    <label>

        <select id="select_brand">

        </select>

    </label>

</div>

<div id="details">

</div>


大话西游666
浏览 95回答 1
1回答

千巷猫影

因此,您需要做的就是检测更改事件并在列表中进行查找。&nbsp;$('#select_brand').change(function() {&nbsp; &nbsp;for(let brand of products){&nbsp; &nbsp; &nbsp; if(this.value === brand.b_name){&nbsp; &nbsp; &nbsp; &nbsp; _detailsList.text(JSON.stringify(brand))&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp;}});只需复制粘贴此代码段并观察逻辑即可。我知道可能会有优化和边缘情况的基调,但对于您提供的这个数据集,我的解决方案应该可以正常工作。
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript