私はSVGイメージにonClickプロンプトを添付しましたが、else文の場合はjQueryを実行するプロンプトが表示されません

Question

私はSVGマップを米国のほとんどのものにしています。もし私が終えることができるようにelse文。目標は、状態をクリックすると（すべての状態のパスとIDがあります）、状態名を尋ねるプロンプトが表示されます。 jQueryコードは、応答iがプロンプトに入力されている場合は状態の緑を入力し、正しい場合は赤を入力すると想定されます。私はプロンプトに何かを入力すると赤く塗りつぶされますが、プロンプトが正しいときでも毎回これを行います。どのように私はこれを修正することができます私は今日までに簡単な答えが必要です。ここ ）はjsfiddle https://jsfiddle.net/vnqcyu90/

jQuery(function($) { 
$('path').click(function() { 
    prompt("Enter State Initials") 
    if ($('path id') == prompt) { 
    this.style.fill = "green"; 
    } else { 
    this.style.fill = "red"; 
    } 



}); 

}です。

私の問題を引き起こすコードの特定の行ですが、SVGマップにonclick関数を追加するだけでなく、私の場合はパスである状態の名前を尋ねるプロンプトに関連するif else文も処理しますid。 （このコードはjQuery 1.7.1です）

Answer 1

コードにはいくつかの問題があります。

まず、Window.prompt()の結果を何にも割り当てていません。あなたは実行する必要があります。

var prompt = window.prompt("Enter State Initials"); 

次の問題は

$('path id') 

jQueryのセレクタは、あなたのセレクタ文字列に一致する要素のリストを返すあなたのjQueryのセレクタです。この場合、先祖<path>要素を持つ "id"（つまり、<id>）という名前のすべての要素を返すように要求しています。

あなたは上をクリックし、パスのid値を確認したい場合は、あなたが何をする必要があるかです：

$(this).get(0).id 

$(this)はjQueryオブジェクトにクリックされた要素になります。 get(0)はjQueryオブジェクトの最初の要素を取得します（jQueryセレクタは常にリストを返します）。ただし、この場合、リストには1つの要素しか存在しません。

要素のid属性は、要素のidプロパティを参照するだけで読み取られます。すべてのあなたの状態IDが大文字なので

var prompt = window.prompt("Enter State Initials") 
if ($(this).get(0).id == prompt) { 
    this.style.fill = "green"; 
} else { 
    this.style.fill = "red"; 
} 

が、あなたはおそらくもの人が中に入力したテキストを変換したいと思う例えば：

だからあなたの最終的なコードは次のようになります。

var prompt = window.prompt("Enter State Initials").toUpperCase(); 

Updated fiddle