Question

有一个脚本可以显示出版物的存档。最初，显示年份列表。单击年份将显示问题列表。当您单击问题时，它将加载。

最初显示所有年份。多年的问题在任何地方都不显示，无显示，单击可转换为显示继承。

它应该像这样：

<ul>
    <li class="arrow">▲</li>
    <li class="journals">
        <ul class="ye">
            <li class="year">2019</li>
            <ul class="in_nums 2019" style="display: none;">
                <li data-issue="7633">№1(67)</li>
            </ul>
            <li class="year">2018</li>
            <ul class="in_nums 2018" style="display: none;">
                <li data-issue="6998">№1(63)</li>
                <li data-issue="7163">№2(64)</li>
                <li data-issue="7320">№3(65)</li>
                <li data-issue="7474">№4(66)</li>
            </ul>
        </ul>
    </li>
    <li class="arrow">▼</li>

从1.7.2版升级到3.3.1版后，以下代码无法正常工作：

$(document).ready(function(){
    $('li.year').toggle(function(){
        $('.in_nums').css('display','none')
        var y = $(this).text()
        $('.'+y).css('display','inherit')
    },
    function(){
        var y = $(this).text()
        $('.'+y).css('display','none')
    })
    $('.in_nums li').click(function(){
        $('#fresh').html('<img src="images/30.gif"/>');
        $.post(location.href,{'art_id':$(this).data('issue')},function(data){
            var result = $.parseJSON(data);
            var fresh = '<div class="lastjor">[[%babel.archive_[[++cultureKey]]]]</div>'
            $('#fresh').html(fresh+result.output)
            $('#latest').html(result.current)
        })
    })
    $.post(location.href,{'art_id':[[!getLastIssueID]]},function(data){
        var result = $.parseJSON(data);
        var fresh = '<div class="lastjor">[[%babel.lastjor_[[++cultureKey]]]]</div>'
        $('#fresh').html(fresh+result.output)
        $('#latest').html(result.current)
    })
})

它不会在发布年份添加展示内容：

<ul>
    <li class="arrow">▲</li>
    <li class="journals">
        <ul class="ye">
            <li class="year" style="display: none;">2019</li>
            <ul class="in_nums 2019" style="display: none;">
                <li data-issue="7633">№1(67)</li>
            </ul>
            <li class="year" style="display: none;">2018</li>
            <ul class="in_nums 2018" style="display: none;">
                <li data-issue="6998">№1(63)</li>
                <li data-issue="7163">№2(64)</li>
                <li data-issue="7320">№3(65)</li>
                <li data-issue="7474">№4(66)</li>
            </ul>
        </ul>
    </li>
    <li class="arrow">▼</li>

jQuery语法是否有所更改，或者可能是问题所在？

Answer 1

您传递给.toggle()的参数对应于removed from jQuery in version 1.9的用法，因此这些函数不再对应于单击处理程序。相反，对toggle的调用将隐藏选定的元素，然后执行作为第二个参数传递的函数。

要在页面上获得与1.7.2版相同的功能，请替换为：

$('li.year').toggle(function(){
    $('.in_nums').css('display','none')
    var y = $(this).text()
    $('.'+y).css('display','inherit')
},
function(){
    var y = $(this).text()
    $('.'+y).css('display','none')
})

具有：

$('li.year').click(function(){
    var y = $(this).text();
    var isVisible = $('.'+y).is(":visible");
    $('.in_nums').hide();
    $('.'+y).toggle(!isVisible);
});

更新jquery后脚本不起作用

1 个答案: