2014-11-06 12 views
0

我已經編寫了下面的代碼,用jquery替換圖像來顯示圖像的運動事件,但是image not found-控制檯輸出中顯示了錯誤。我已經上傳了所有圖像,所有圖像都有權讀取,寫入和執行。如何使用jquery替換html中的圖像

var i = 1;      // set your counter to 1 

var strOutput; 
var luckyNumber; 
var imgStr=""; 
var time; 
function ShowLuckyNumber() { 
    $('#play').css('display','none'); 
    $('#btnLuck').css('display','none'); 
    $('#numbers').css('display','none'); 
    $('.TestRotator').css('display','block'); 

    var rotator = document.getElementById('rotator'); // change to match image ID 
    var imageDir = 'http://perfectinter.net/subdomains/lottefree/image/'; 
    var delayInSeconds = 1; 
    var images = ['draw_001.jpg', 'draw_002.jpg', 'draw_003.jpg', 'draw_004.jpg', 'draw_005.jpg', 'draw_006.jpg', 'draw_007.jpg', 'draw_008.jpg', 'draw_009.jpg','draw_010.jpg','draw_011.jpg', 'draw_012.jpg', 'draw_013.jpg', 'draw_014.jpg', 'draw_015.jpg', 'draw_016.jpg', 'draw_017.jpg', 'draw_018.jpg', 'draw_019.jpg','draw_020.jpg','draw_021.jpg', 'draw_022.jpg', 'draw_023.jpg', 'draw_024.jpg', 'draw_025.jpg', 'draw_026.jpg', 'draw_027.jpg', 'draw_028.jpg', 'draw_029.jpg','draw_030.jpg','draw_031.jpg', 'draw_032.jpg', 'draw_033.jpg', 'draw_034.jpg', 'draw_035.jpg', 'draw_036.jpg', 'draw_037.jpg', 'draw_038.jpg', 'draw_039.jpg','draw_040.jpg','draw_041.jpg','draw_042.jpg','draw_043.jpg','draw_044.jpg','draw_045.jpg','draw_046.jpg','draw_047.jpg','draw_048.jpg','draw_049.jpg','draw_050.jpg','draw_051.jpg','draw_052.jpg','draw_053.jpg','draw_054.jpg','draw_055.jpg','draw_056.jpg','draw_057.jpg','draw_058.jpg','draw_059.jpg','draw_060.jpg','draw_061.jpg','draw_062.jpg','draw_063.jpg','draw_064.jpg','draw_065.jpg','draw_066.jpg','draw_067.jpg','draw_068.jpg','draw_069.jpg','draw_070.jpg','draw_071.jpg','draw_072.jpg','draw_073.jpg','draw_074.jpg','draw_075.jpg','draw_076.jpg','draw_077.jpg','draw_078.jpg','draw_079.jpg']; 
    var num = 0; 
    var value=1; 
    var path=""; 
    var changeImage = function() { 
     var len = images.length; 
     //rotator.src = imageDir + images[num++]; 
     path=imageDir + images[num++]; 
     $('#rotator').attr('src',path); 

     //alert(rotator.src); 
     if (num == len) { 
      num = 0; 
      resetfun(); 
     } 
    }; 
    time=setInterval(changeImage, delayInSeconds * 50); 
} 

function resetfun() 
{ 
    clearTimeout(time); 
    luckyNumber=Math.floor((Math.random() * 9999) + 1); 

    var dataString ='number='+luckyNumber; 
    /* $.ajax({ 
     type: "POST", 
     url: "playentry.php", 
     data: dataString, 
     success: function(data){ 
      $("#dealsptab").html(data); 
     } 
    });*/ 
    var check=$('#dealpt').val(); 
    if(check==0) 
    { 
     document.location.href='dealpoint.php'; 
    } 
    var luckyNums = document.getElementById("numbers"); 

    var frontTag = "<span>"; 
    var backTag = "</span>"; 

    if (luckyNumber < 10) 
     strOutput = "000" + luckyNumber; 
    else if (luckyNumber < 100) 
     strOutput = "00" + luckyNumber; 
    else if (luckyNumber < 1000) 
     strOutput = "0" + luckyNumber; 
    else 
     strOutput = "" + luckyNumber; 

    var j=0; 
    for (var i = 0; i < 4; i++) { 
     imgStr += frontTag + strOutput.substr(i, 1) + backTag; 
     j=i+1; 
     $('#sp'+j).val(strOutput.substr(i, 1)); 
    } 
    $('.TestRotator').css('display','none'); 
    $('#play').css('display','block'); 
    $('#btnLuck').css('display','block'); 
    $('#numbers').css('display','block'); 
    return false; 
} 
+0

我刪除了代碼片段,因爲它沒有顯示任何內容。在代碼片段中發佈依賴'DOM'元素而不使用HTML的js是沒用的... – 2014-11-06 08:48:05

回答

2

要設置的準備:

$(function() { 
$("img") 
    .mouseover(function() { 
     var src = $(this).attr("src").match(/[^\.]+/) + "over.gif"; 
     $(this).attr("src", src); 
    }) 
    .mouseout(function() { 
     var src = $(this).attr("src").replace("over.gif", ".gif"); 
     $(this).attr("src", src); 
    }); 

});