1

ここのコードに少し問題があります。私はそれにかなり慣れていないので、その単純な場合はお詫び申し上げます。しかし、説明が大好きです。

だからここに私が持っているhtmlがあります：

<div class="one" data-selection="1"></div>
<p class="selections"></p>
<p class="cost">£ <span class="price">0</span></p>

そしてここにJavaScriptがあります：

<script>
// Empty array to capture selections
    var a = [];
    var originalValue = "You have Selected section(s): ";  
    $(".one").click(function () {
        if ($(this).attr('class') == "selected one") {  
            //alert
            alert("Are you sure you wish to de-select?");       
            //remove from the total
            $(".price").html(parseInt($(".price").html(),10) - 30)  
            $(this).removeClass("selected ");   
            // need to get remove from array
            var removeItem = $(this).attr("data-selection");  
            a = jQuery.grep(a, function(value) {
                return value != removeItem;
            });      
            $('.selections').text(originalValue + a);   
        }
        else {
            var selection = $(this).attr("data-selection");
            alert(selection);
            var originalSrc = $(this).attr('class');
            $(this).attr('class', 'selected ' + originalSrc);     
            a.push(1);
            a.sort();           
            $('.selections').text(originalValue + a);   
            $('.price').text(function(i, txt) {
                return +txt + 30;
            });
        }
    });
</script>

これは正常に機能します。ただし、ifステートメントの内容を次の関数に追加すると、次のようになります。

undoSelection()

コードを次のように変更します。

$(".one").click(function () {
    if ($(this).attr('class') == "selected one") {
        undoSelection();
    }
    else {

確実に作品の選択を解除するかどうかを尋ねるアラートの後は何もありません。そこにアラートを追加して取得した場合

  $(this).attr("data-selection");

未定義のアラート。

重複したコードの行に行が必要ないので、関数に入れたいです:(

誰かがこれに光を当ててくれませんか？

4

1 に答える 1

1

それはあなたが$(this)まだ呼ばれているからだと思います。キーワードthisは$(".one")最初は意味thisしますが、関数を呼び出すと、その後のコンテキストが変わります。別の関数で機能させたい場合は、変数をの値に設定し、関数内では$(".one")なくそれを使用する必要があり$(this)ます。

取得するのは難しいですが、thisjavascriptのキーワードは常に、関数がメソッドであるオブジェクトを参照しています。したがって、最初のケースではこれが参照され$(".one")ますが、他のロジックを別の関数内に移動すると、定義が変更されます（グローバルオブジェクト、通常はウィンドウに）。

私はあなたが探しているものの実用的な例を示すjsFiddleを作成しました：http： //jsfiddle.net/CKCjz/1/

于 2012-07-17T01:01:32.547 に答える