0

jquery-plugin mapster を使用してイメージマップをセットアップしました

コードは、どの国がクリックされたかを示しています（エジプトの場合は「1」、リビアの場合は「2」..）

    $(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
    });
    });

私の問題: 次のようなさまざまな国のループでユーザーに尋ねたい: 「エジプトをクリックしてください」

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

「チュニジアをクリックして」……

このループをコーディングする方法がわからないため、ユーザーは最初の国を尋ねられ、ユーザーが国をクリックするまでプログラムは待機し、次にユーザーは2番目の国を尋ねられます....

ありがとう

カート

4

1 に答える 1

0

ループは必要ありません。JavaScriptは、「ユーザー入力を待つ」のではなく、イベント駆動型のアクションに適しています。

事前定義されたキーを使用して国名の配列（またはオブジェクト）を保持し、次のような構造を使用してユーザーにプロンプ​​トを表示します。

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

次に、javascriptを使用して、現在のキーに基づいて表示される名前を動的に変更します。

JSの例（完全ではありませんが、必要な情報があります）：

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"
    }
}
于 2012-04-08T05:20:08.527 に答える