將變量傳遞給jQuery點擊處理程序

Question

我想將兩個變量傳遞給click函數，但是我不知道該怎么做。 我想傳遞變量調用stringUrl和stringUrl2，但控制台告訴我變量未定義。

第一個功能：

 $('.fancy .slot').jSlots({
        number : 1,
        winnerNumber : 1,
        spinner : '#playFancy',
        easing : 'swing',
        time : 1000,
        loops : 1,
        onStart : function() {

            $('.slot').removeClass('winner');
        },
        onWin : function(winCount, winners, finalNumbers) {

        },  
        onEnd : function(winCount, winners, finalNumbers) {


        var selector = $('.fancy .slot li:nth-child(' +winCount[0])
        var stringUrl = selector.css('background-image');
        stringUrl = stringUrl.replace('url(','').replace(')','');
        stringUrl = stringUrl.substr(41);
        alert(stringUrl);

        }
    });

第二功能：

  $('.fancy2 .slot2').jSlots({
        number : 1,
        winnerNumber : 1,
        spinner : '#playFancy2',
        easing : 'easeOutSine',
        time : 1000,
        loops : 1,
        onStart : function() {
            $('.slot2').removeClass('winner');
        },
        onWin : function(winCount, winners, finalNumbers) {

        },
        onEnd : function(winCount, winners, finalNumbers) {


        var selector = $('.fancy2 .slot2 li:nth-child(' +winCount[0])
        var stringUrl2 = selector.css('background-image');
        stringUrl2 = stringUrl2.replace('url(','').replace(')','');
        stringUrl2 = stringUrl2.substr(41);
        alert(stringUrl2);

        }
    });

我需要變量的功能：

$('#btnConfirm').click(function(){


        console.log(stringUrl);
        console.log(stringUrl2);
        if(stringUrl){


        Swal.fire({
        background: 'no-repeat center url(/start/assets/img/rouletteArt/popup-bravo.png)',
        showConfirmButton : true,
        confirmButtonClass : 'placeButton',
        confirmButtonColor: '#253654',
          animation: false,
            customClass: {
                popup: 'animated tada'
            }

Answer 1

你有這個：

$(document).ready(function(){
    $('.fancy .slot').jSlots({
        //stuff

            var stringUrl = selector.css('background-image');
            stringUrl = stringUrl.replace('url(','').replace(')','');
            stringUrl = stringUrl.substr(41);
    });
    $('.fancy2 .slot2').jSlots({
            //stuff

            var stringUrl2 = selector.css('background-image');
            stringUrl2 = stringUrl2.replace('url(','').replace(')','');
            stringUrl2 = stringUrl2.substr(41);
    });
    $('#btnConfirm').click(function(){
        alert(stringUrl);
        alert(stringUrl2);

    });
});

你要這個：

$(document).ready(function(){
    var stringUrl, stringUrl2; //<=====================

    $('.fancy .slot').jSlots({
        //stuff

            stringUrl = selector.css('background-image'); //<==============
            stringUrl = stringUrl.replace('url(','').replace(')','');
            stringUrl = stringUrl.substr(41);
    });
    $('.fancy2 .slot2').jSlots({
            //stuff

            stringUrl2 = selector.css('background-image'); //<==============
            stringUrl2 = stringUrl2.replace('url(','').replace(')','');
            stringUrl2 = stringUrl2.substr(41);
    });
    $('#btnConfirm').click(function(){
        alert(stringUrl);
        alert(stringUrl2);

    });
});

Answer 2

您可以嘗試使用bind() ：

onEnd: function(stringUrl, winCount, winners, finalNumbers) {

}.bind(null, stringUrl)

當您綁定這樣的變量時，回調將在執行時作為默認參數之前的參數接收它。 這種做法可能有一些缺點，但是，如果其他范圍建議失敗，則這可能是您的情況的解決方案，因為您的代碼非常簡單。