パラメータをjQuery関数に渡す

Question

jQueryツール（http://jquerytools.org/）を使用しており、渡されたパラメータを受け入れるための以下の関数を取得できません。私はjavascriptやjqueryに堪能ではなく、下のコードでこの作業を行う場所をどこでも見つけることができません。何か助けてくれてありがとう！

現在の設定：

<a href='javascript:popup();'>Text Link That Calls Below Function</a> 



<script> 
function popup() { 
if ($("#facebox").hasClass("init")) { 
    $("#facebox").overlay().load(); 
} 
else { 
    $("#facebox").addClass("init"); 
    $("#facebox").overlay({ 

    // custom top position 
    top: 260, 

    mask: { color: '#838383', 
     loadSpeed: 200, 
     opacity: 0.5 
    }, 
    closeOnClick: true, 
    load: true 
    }); 
} 
} 
</script> 

あなたはリンゴという名前の変数を持っていない限り、私はそれがこのような何かをしたいと思います...

<a href='javascript:popup(apples);'>Text Link That Calls Below Function</a> 



<script> 
function popup(choosebox) { 
if ($("#choosebox").hasClass("init")) { 
    $("#choosebox").overlay().load(); 
} 
else { 
    $("#choosebox").addClass("init"); 
    $("#choosebox").overlay({ 

    // custom top position 
    top: 260, 

    mask: { color: '#838383', 
     loadSpeed: 200, 
     opacity: 0.5 
    }, 
    closeOnClick: true, 
    load: true 
    }); 
} 
} 
</script> 

Answer 1

あなたは、arguementとして文字列を渡す必要があります（var apples;）である。

<a href='javascript:void(0)' class="aLink" >Text Link That Calls Below Function</a> 

：あなたはjQueryのを使用しているので popup("apples")

を囲む引用符は、あなたが以下のようにうまくそれを行うことができます注、

HTML

<a href='javascript:popup("apples");'>Text Link That Calls Below Function</a> 

、以下のようにそれを変更してみてください

JS：

$(function() { 
    $('.aLink').click(function() { 
     popup("apples"); 
    }); 
}); 

また、私は控えめなjavascriptのアプローチは、一般的に、より良いとjQueryの方法と考えている

function popup(choosebox) { 
    var $choosebox = $("#" + choosebox); 

    if ($choosebox.hasClass("init")) { 
     $choosebox.overlay().load(); 
    } 
    else { 
     $choosebox.addClass("init"); 
     $choosebox.overlay({ 
    //..rest of your code 

Answer 2

、あなたは以下のようなあなたのセレクタを変更する必要があるかもしれないと思います。あなたの提供

$('a.someclass').click(function() { popup('orange'); }); 

は、あなたの<a>要素は、この例では、「工ass」のクラスを持って与えます。

これは、あなたのHTMLからあなたのjsを隔離します。このコードは、文書readyイベントに行くことができる：

$(document).ready(function() { 
// code here 
}); 

Answer 3

が、その後、そのアンカー上のクラスのクリックイベントを書き込みデータ - 属性を読み取ることによって、そのリンクに関連している「箱」を決定します。これにより、再利用可能なジェネリックなjQueryコードのブロックが得られます。このブロックは、このパターンに一致するアンカータグで呼び出すことができます。

HTML：

<a href="#" class="popup" data-choosebox="apples">Text Link That Calls Below Function</a>

はJavaScript：

$(document).ready(function(){ 

    $('a.popup').on('click', function(e){ 

     var $_target = $('#' + $(this).data("choosebox")); 

     if ($_target.hasClass("init"){ 
      $_target.overlay().load(); 
     } else { 
      $_target.overlay().load({ 

       top: 260, 
       mask: { color: '#838383', 
         loadSpeed: 200, 
         opacity: 0.5 }, 
       closeOnClick: true, 
       load: true 
      }); 
     } 
     e.preventDefault(); 

    }); 

}); 
​