2012-04-06 7 views
0

Ich habe meinen imagemap mit der Jquery-Plugin MapsterWie man auf Benutzerinteraktion in einem jquery-plugin (imagemap) wartet?

der Code zeigt mir, welche Länder geklickt eingerichtet ('1' für Ägypten, '2' für Libyia ..)

$(document).ready(function() { 

    function geklickt (e){ 
    //alert(typeof e.key);  return string 
    $('.showme').append(e.key+ ' '); 
    } 


    $('img').mapster({ 
    mapKey: 'ALT', 
    stroke: true, 
    strokeWidth: 2, 
    strokeColor: 'ff0000' , 
    onConfigured: function(){ 
    // howto set up loop for asking user here??? 
    } , 
    onClick: geklickt 
    }); 
    }); 

Meines Problem: ich möchte für verschiedene Länder wie diese dem Benutzer in einer Schleife fragen: „Klicken Sie auf Ägypten“

if (e.key == '1') 
    { 
    // message "Ok" 
    // add one point 
    } 
    else 
    { 
    // message "NOT Ok" 
    } 

„Klicken Sie auf Tunesien“ ...

Ich weiß nicht, wie diese Schleife codieren, so dass der Benutzer das erste Land aufgefordert wird, und dann das Programm wartet, bis der Benutzer ein Land geklickt hat, und dann wird der Benutzer das zweite Land gefragt ....

dank

Kurt

Antwort

0

Sie benötigen keine Schleife. JavaScript eignet sich für ereignisgesteuerte Aktionen und nicht für "Warten auf Benutzereingaben".

ein Array Halten (oder Objekt) der Ländernamen ihre vordefinierten Tasten und eine Struktur, wie diese verwendet werden um den Benutzer aufzufordern:

<div>Click on <span id="countryname"></span></div> 

Dann JavaScript verwenden, um dynamisch den Namen angezeigt zu ändern basierend der aktuelle Schlüssel

Beispiel JS (nicht vollständig, sondern hat notwendige Informationen):

var countryArray, currentKey; 
countryArray = []; 
/* 
* populate countryArray using keys like this 
* countryArray[key] = "Name"; 
*/ 
function setCountry(key){ 
    $("#countryname").text(countryArray[key]); 
} 

currentKey = 0; //can be set randomly or however you'd like 
setCountry(currentKey); 

function geklickt (e){ 
    if(currentKey == e.key){ 
     //success 
     //add one point 
     currentKey = newKey; //however you want to set it 
     setCountry(currentKey); 
    } else { 
     //failure 
     //message: "NOT OK" 
    } 
} 
+0

Added eine Linie, um das Array zu initialisieren. Wie ich schon sagte, es war nicht vollständig - nur um Ihnen zu zeigen, was Sie tun mussten. Hat dies für Sie funktioniert? – ramblinjan

+0

ja! vielen Dank! – Kurt