jQuery驗證插件：我有多個圖像，並且需要選擇一個圖像

我正在使用jQuery驗證插件，但是我的表單包含某種圖像選擇器，並且我需要驗證它是否選擇了一個圖像或者不..但我不知道是否有可能在jQuery驗證插件。以下是代碼片段：jQuery驗證插件：我有多個圖像，並且需要選擇一個圖像

<div id="options"> 
    <h1>Type</h1> 
    <ul> 
     <li> 
      <p><a href="#"><img src="../images/general/option1.png" /></a>option1</p> 
     </li> 
     <li> 
      <p><a href="#"><img src="../images/general/option2.png" /></a>option2</p> 
     </li> 
     <li> 
      <p><a href="#"><img src="../images/general/option3.png" /></a>option3</p> 
     </li> 
     <li> 
      <p><a href="#"><img src="../images/general/option4.png" /></a>option4</p> 
     </li> 
    </ul> 
</div>

如何在jQuery驗證插件中對此進行驗證？

來源

2011-10-21 Kevin Lee

如何在用戶選擇的圖像？你使用的是類似jQuery UI的東西嗎？是否有一個類添加到圖像將其標記爲選中？爲什麼你有標籤，但沒有標籤？ – Whetstone

你的html無效。您爲每個圖像關閉了標記，但沒有打開標記。你還有什麼嘗試與您的js/jQuery？ –

哎呀，我錯誤地刪除了標籤，使我的代碼混亂消失.. –

您可以將圖像選擇視爲一組單選按鈕輸入，並使用jQuery驗證來要求檢查其中一個。有關如何將圖像用作單選按鈕的示例，請參閱本網站：http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/。

如果您想要添加對多個選擇的支持，您可以使用複選框而不是單選按鈕。

來源

2011-10-21 15:13:04 ampersandre

好吧，我嘗試後發佈反饋。謝謝！ –

我認爲你最好的選擇是根據你所說的使用一些自定義代碼。如果您已經有一個限制器來確保只有一個圖像帶有選定的類，只需運行$（「。whatever」）並檢查長度是否等於1。它只有3行代碼。

來源

2011-10-21 15:13:06 Whetstone

感謝您的評論。我最初的實現是，但我認爲這會更好，如果我使用jQuery驗證插件，因爲我的其他投入使用它。 –

@Kevin李，看看這個jQuery插件 http://jordankasper.com/jquery/imagecheck/examples.php

你只需要到（根據需要）無線電/複選框組運用這個插件，並設置驗證的圖像相關的無線電/複選框輸入欄「需要」。和所有的代碼應該是即

<form id='gallery_form'> 
<label>Sea</label> 
<input type='checkbox' name='image_gallery' value='sea' /> 

<label>Mountain</label> 
<input type='checkbox' name='image_gallery' value='mountain' /> 

<label>Sky</label> 
<input type='checkbox' name='image_gallery' value='sky' /> 

<label>Sun</label> 
<input type='checkbox' name='image_gallery' value='sun' /> 

</form>

和JavaScript

$(document).ready(function(){ 

     $('input[name="image_gallary"]').each(function(){ 
       var src=this.value; 
       $(this).simpleImageCheck({ 
        image: src+'.png' 
        imageChecked: src.'_selected.png' 
       }); 

     }); 

    $("#gallery_form").validate(); 

    });

只是給u和想法，希望在標籤內這將有助於:)

來源

2011-10-21 15:44:42 sakhunzai

jQuery驗證插件：我有多個圖像，並且需要選擇一個圖像

回答

相關問題