2013-11-14 68 views
0

Demo商品的順序選擇

$(function(){ 

var questions = $('#questions'); 

function refreshSelects(){ 
    var selects = questions.find('select'); 

    // Улучшаем элемент selects с помощью плагина Chose 
    selects.chosen(); 

    // Ждем изменений 
    selects.unbind('change').bind('change',function(){ 

     // Выбранная опция 
     var selected = $(this).find('option').eq(this.selectedIndex); 
     // Ищем атрибут data-connection 
     var connection = selected.data('connection'); 

     // Удаляем следующий контейнер li (к=если есть) 
     selected.closest('#questions li').nextAll().remove(); 

     if(connection){ 
      fetchSelect(connection); 
     } 

    }); 
} 

var working = false; 

function fetchSelect(val){ 

    if(working){ 
     alert('предлагаем Вам следующие товары: ') 
     return false; 
    } 
    working = true; 

    $.getJSON('ajax.php',{key:val},function(r){ 

     var connection, options = ''; 

     $.each(r.items,function(k,v){ 
      connection = ''; 
      if(v){ 
       connection = 'data-connection="'+v+'"'; 
      } 

      options+= '<option value="'+k+'" '+connection+'>'+k+'</option>'; 
     }); 

     if(r.defaultText){ 

      // Плагин Chose требует, чтобы был добавлен пустой элемент опции 
      // если нужно выводить текст "Пожалуйста, выберите" 

      options = '<option></option>'+options; 
     } 

     // Строим разметку для раздела select 

     $('<li>\ 
      <p>'+r.title+'</p>\ 
      <select data-placeholder="'+r.defaultText+'">\ 
       '+ options +'\ 
      </select>\ 
      <span class="divider"></span>\ 
     </li>').appendTo(questions); 

     refreshSelects(); 

     working = false; 
    }); 

} 

$('#preloader').ajaxStart(function(){ 
    $(this).show(); 
}).ajaxStop(function(){ 
    $(this).hide(); 
}); 

// В начале загружаем выбор продукта 
fetchSelect('productSelect'); 
}); 

介紹如何選擇一個標籤,而不是後者給激活鏈接的形式的結果?也就是說,畢竟是選擇了,我想得到一個結果。例如,您繪製了所有參數,我需要爲他提供可用產品列表。怎麼做?此代碼中需要更改的地方和內容? 向上問題

回答

0
<select id="select"> 
    <option value="" selected>Pick a Website</option> 
    <option value="http://www.google.com/">Google</option> 
    <option value="http://www.yahoo.com/">Yahoo</option> 
</select> 

<script> 
    $(function(){ 
     // bind change event to select 
     $('#select').bind('change', function() { 
      var url = $(this).val(); // get selected value 
      if (url) { // require a URL 
       window.location = url; // redirect 
      } 
      return false; 
     }); 
    }); 
</script> 
+0

我可能是錯的,解釋。我需要看到圖片和描述的列表。不要打開列表。 – user2382168

+0

如何做target = _blank? – user2382168