Question

所以，正如我想的那样，我的头衔并不是很容易理解。我有这个jquery代码：

$("img.slideimg").click(function(){
    var id = $(this).attr('id');
    $("img.previewimg." + id).css({"display": "block"});
    $("div.imgpreview").css({"display": "flex"});

    function slideDo(n) {
        var i;
        var aux = id - 1 + n;
        var slidesp = document.getElementsByClassName("previewimg");
        if (aux > slidesp.length) {aux = 1}
        if (aux < 1) {aux = slidesp.length}
        for (i = 0; i < slides.length; i++) {
        slidesp[i].style.display = "none";
    }
    slidesp[aux-1].style.display = "block";
    }
});

问题是浏览器控制台输出是这样的：

Uncaught ReferenceError: slideDo is not defined
at HTMLAnchorElement.onclick (index.html:85)

我的问题是我想创建一个使用$（“img.slideimg”）。click事件变量的函数。这个变量是id = $（this）.attr（'id'）;所以我想到在其中创建函数。显然它不能像这样工作所以我需要一点帮助。

如果你不理解我，很抱歉。我对这种编码很新:(

我使用slideDo的HTML

<div class="middle">
  <a class="prev" onclick="slideDo(-1)"> ❮ </a>
  <div class="imglink">
    <img src="img/dailyui/008.png" class="previewimg 1">
    <img src="img/dailyui/007.jpg" class="previewimg 2">
    <img src="img/dailyui/006.jpg" class="previewimg 3">
    <img src="img/dailyui/003.jpg" class="previewimg 4">
  </div>
  <a class="next" onclick="slideDo(1)"> ❯ </a>
</div>

所以我想做什么：我有一个幻灯片，当我点击其中一张图片时，会显示带有图片的模态。然后在这里我再次有下一个/上一张图片的按钮，但它们似乎不起作用。这是我的代码的演示网站：beta.eduardstefan.com

Answer 1

名称slideDo的范围只是点击功能，但您似乎正在尝试从全局范围（锚点的onclick属性）调用它。您需要将函数分配给全局变量。

var slideDo = function() {}; // initially does nothing

$(document).ready(function() {
    $("img.slideimg").click(function(){
        var id = $(this).attr('id');
        $("img.previewimg." + id).css({"display": "block"});
        $("div.imgpreview").css({"display": "flex"});

        slideDo = function(n) {
            var i;
            var aux = id - 1 + n;
            var slidesp = document.getElementsByClassName("previewimg");
            if (aux > slidesp.length) {aux = 1}
            if (aux < 1) {aux = slidesp.length}
            for (i = 0; i < slides.length; i++) {
            slidesp[i].style.display = "none";
        }
        slidesp[aux-1].style.display = "block";
        }
    });
});

如何在$ .click（jquery）中创建一个使用$ .click

1 个答案: