jQuery打開fancybox如果條件符合

Question

我有一個錨打開fancybox。我希望fancybox僅在選擇框中進行選擇時才能打開。

我發現將一個click事件綁定到具有preventDefault或返回false的錨點並不妨礙fancybox打開。 我確實找到了一種方法來阻止fancybox打開。現在我有：

HTML所述的fancybox被綁定到所述錨的類名 「bigfancybox」（在fancybox.js定義的寬度，高度等）

<div> 
<a id="brasil" href="<?php echo $this->url(array("module" => "amodule", "controller" => "acontroller", "action" => "soccer"))?>" class="someclass bigfancybox"><?=$this->translate('soccer')?></a> 
</div> 

尺寸。

在jQuery中我有一個檢查，如果在match_id做出選擇：

jQuery("#brasil").fancybox({ 
onStart: function() { 
var matchid = jQuery('#match_id').val(); 
if(matchid == '') 
    { 
     alert(selectmatchmessage); 
     return false; 
    } 
} 
}); 

這一切工作正常，除了如果條件滿足，現在的fancybox的默認尺寸打開，是不是打開作爲iframe，因爲它沒有jQuery條件。有沒有辦法在打開iframe中的fancybox之前先檢查一個條件？

Answer 1

您可能需要一個click事件綁定到你的#brasil選擇（或者，如果你喜歡你的.bigfancybox選擇），而不是的fancybox。

然後，驗證條件事件和火災的fancybox編程如果條件滿足後，否則什麼也不做（返回false），如：

jQuery("#brasil").on("click", function() { 
    var matchid = jQuery('#match_id').val(); 
    if (matchid !== '') { 
     // condition is NOT empty, so fire fancybox 
     jQuery.fancybox({ 
      // fancybox API options 
      href: this.href, 
      type: "iframe" 
     }); 
    }; 
    return false; // prevent default and stop propagation 
}); // on click 

見JSFIDDLE

備註：

小提琴使用fancybox v1.3.4，但代碼將無縫地爲fancybox v2.x工作，只要確保您爲每個版本使用正確的API選項。