Question

我尝试将菜单（ul和li s）转换为移动设备select和option。我想保留已经存在<li>个元素的类。我可以转换它们，但我不知道如何让班级从li到option。我该怎么办？

jQuery(document).ready(function ($) {
       if ($(window).width() < 639) {
           $('ul#nav').each(function () {
               var list = $(this),
                   select = $(document.createElement('select')).insertBefore($(this).hide());

               $('>li a', this).each(function () {
                   var target = $(this).attr('target'),
                       option = $(document.createElement('option'))
                           .appendTo(select)
                           .val(this.href)
                           .html($(this).html())
                           .click(function () {
                           if (target === '_blank') {
                               window.open($(this).val());
                           } else {
                               window.location.href = $(this).val();
                           }
                       });
               });
               list.remove();
           });
       }
   });

Answer 1

您可以使用closest()获取对li的引用。
class是一个与target类似的属性。只需使用class上的attr()获取li，然后使用attr()上的option进行保存。

我不会给你代码，因为你最好自己写代码。

Answer 2

使用您提供的代码，您可以尝试：

$('>li a', this).each(function() {
    var target = $(this).attr('target'),
    var classes = $(this).parent('li').attr('class'), //store the classes in the element
    option = $(document.createElement('option'))
        .appendTo(select)
        .val(this.href)
        .addClass(classes) //add the classes to the new option element
        .html($(this).html())
        ...

Answer 3

试试这个

var cls= $(this).attr('class')

将此课程添加到option

$(document.createElement('option'))
                           .appendTo(select)
                           .val(this.href)
                           .html($(this).html()).addClass(cls)

将ul转换为<select>和<option>并保持类</option> </select>

3 个答案: