显示Json文件中的更多特定项

时间:2015-09-01 12:58:31

标签: javascript json

已经解决了。

我有一个名为cars的Json数组。有价值"类型"在里面,表示所需的燃料。 为了澄清,我创建了一个示例页面,您可以在其中尝试:https://jsfiddle.net/vladoss/dp22yshy/

当前解决方案适用于所选选项"所有","柴油","汽油"和" gas"。我需要调整它以使功能也组合选择 - 燃气+汽油,燃气+柴油,柴油+汽油。



Tuple

//json - list of cars
var cars = [
    { title: 'Diesel', type: 'diesel', url: '', img: ''},
    { title: 'Petrol', type: 'petrol', url: '', img: ''},
    { title: 'Gas',    type: 'gas',    url: '', img: ''},
];

//script
window.addEventListener('load', function() {    
    var results = document.getElementById('cars');
    
    function show() {
        var typeField = document.getElementById('type'); 	//read selected type
        var s = typeField.selectedIndex;                	//index of the selected type
        var type = typeField.options[s].value;   			//value of the var s
        var resultsHtml = '';
        
        var carsLength = cars.length;
        for(var i = 0; i < carsLength; i++) {
            //functional for the select "all" and "individual" types
			//I need add a possibility for selecting combination of two and more types (diesel + petrol)
            if (type == 'all' || type == cars[i].type) {
                resultsHtml += '<a href="' + cars[i].url +'">\
 								<div class="rollover"><img class="lazy playable" src="' + cars[i].img + '" alt="'+ 									cars[i].title +'" width="60px" height="50px"></div></a>'
            }
        }
        
        results.innerHTML = resultsHtml;
    } 
    var showBtn = document.getElementById('showBtn'); 
    showBtn.addEventListener('click', show);
});
&#13;
&#13;
&#13;

感谢您的帮助! :)。 https://jsfiddle.net/vladoss/dp22yshy/

2 个答案:

答案 0 :(得分:1)

创建一个$this->db->where('id', $id); $this->db->delete('mytable'); 分隔值,在更改时将其拆分,然后检查所选值数组中的-

indexOf

JS:

<!--Split by - --->
<option value="diesel-petrol">diesel and petrol</option>  
<option value="diesel-gas">diesel and gas</option>  
<option value="petrol-gas">petrol and gas</option> 

演示:https://jsfiddle.net/dp22yshy/1/

答案 1 :(得分:0)

//json - list of cars
var cars = [{
  title: 'Diesel',
  type: 'diesel',
  url: '',
  img: ''
}, {
  title: 'Petrol',
  type: 'petrol',
  url: '',
  img: ''
}, {
  title: 'Gas',
  type: 'gas',
  url: '',
  img: ''
}, {
  title: 'Diesel and Petrol',
  type: 'diesel_petrol',
  url: '',
  img: ''
}, {
  title: 'Diesel and Gas',
  type: 'diesel_gas',
  url: '',
  img: ''
}, {
  title: 'Petrol and Gas',
  type: 'petrol_gas',
  url: '',
  img: ''
}];

//script
window.addEventListener('load', function() {
  var results = document.getElementById('cars');

  function show() {
    var typeField = document.getElementById('type'); //read selected type
    var s = typeField.selectedIndex; //index of the selected type
    var type = typeField.options[s].value; //value of the var s
    var resultsHtml = '';

    var carsLength = cars.length;
    for (var i = 0; i < carsLength; i++) {
      //functional for the select "all" and "individual" types
      //I need add a possibility for selecting combination of two and more types (diesel + petrol)
      if (type == 'all' || type == cars[i].type) {
        resultsHtml += '<a href="' + cars[i].url + '">\
 								<div class="rollover"><img class="lazy playable" src="' + cars[i].img + '" alt="' + cars[i].title + '" width="60px" height="50px"></div></a>'
      }
    }

    results.innerHTML = resultsHtml;
  }
  var showBtn = document.getElementById('showBtn');
  showBtn.addEventListener('click', show);
});
<label>fuel</label>
<select id="type">
  <option value="all">All</option>
  <option value="petrol">petrol</option>
  <option value="diesel">diesel</option>

  <!-- I need make functional these three options below -->
  <option value="diesel_petrol" + value="petrol">diesel and petrol</option>
  <option value="diesel_gas" + value="gas">diesel and gas</option>
  <option value="petrol_gas" + value="gas">petrol and gas</option>
</select>
<button id="showBtn">Show</button>
<div id="cars"></div>