2013-06-26 34 views
1

我有一個簡單的評級系統與jQuery Raty插件http://wbotelhos.com/raty/。用戶應該能夠點擊一個星號,輸入一個非常簡短的文字,然後點擊一個按鈕。該按鈕有一個onClick函數:jQuery Raty獲取星號

<a onclick="submitReview(eventID, stadt)" data-role="button" data-theme="b">Feedback abgeben</a> 

這需要此函數調用eventID,stadt和選定的星數。如何將星星的數量傳遞給onClick函數?這是我的代碼:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<title>Single page template</title> 

<link rel="stylesheet" href="css/jquery.mobile-1.3.1.min.css" /> 
<link rel="stylesheet" href="css/tellthedj.css" /> 
<link rel="stylesheet" href="css/styles.css" /> 
<link href='http://fonts.googleapis.com/css?family=Titillium+Web:300,600' rel='stylesheet' type='text/css'> 
<script src="js/jquery-1.8.3.min.js"></script> 
<script src="js/jquery.mobile-1.3.1.min.js"></script> 
</head> 

<body> 

<div data-role="page" id="menu"> 
<script src="js/functions.js"></script> 
<script type="text/javascript" src="js/jquery.raty.js"></script> 
<script> 
    $(document).delegate('#menu', 'pageshow', function() { 
     $('#star').raty(); 
     stadt = GetURLParameter('stadt'); 
     document.getElementById('deinestadt').value = stadt; 
     id = GetURLParameter('id'); 
     getEventFromId(id); 
     getEventText(id); 
     eventID = GetURLParameter('id'); 

     $("a.button").click(function(){ 
     //Lets say, the Stars are next element to the <a> 
     var stars = $(this).next().find("input[name='score']").val(); 
     submitReview(eventID, stadt, stars); 
}); 

    }); 
</script> 


<div data-role="panel" id="panel"> 
    <input id="deinestadt" style="text-align:left;" type="search" name="stadt" value="" onfocus="if(this.value=='wo bist du?') this.value=''" id="stadt" value="" /> 
    <br> 
    <a class="menu_button" onclick="location='events.html?stadt='+stadt;" data-transition="slide" data-role="button"><img src="img/icon-map-marker.png"><span class="button_text">Events in der Nähe</span></a> 
    <a class="menu_button" onclick="location='menu.html?stadt='+stadt+'&id='+eventID;" data-transition="slide" data-role="button"><img src="img/icon-house.png"><span class="button_text">Event Übersicht</span></a> 
    <br> 
    <a class="menu_button" onclick="location='reviews.html?stadt='+stadt+'&id='+eventID;" data-transition="slide" data-role="button"><img src="img/icon-badge.png"><span class="button_text">Bewertungen ansehen</span></a> 
    <a class="menu_button" onclick="location='review.html?stadt='+stadt+'&id='+eventID;" data-role="button"><img src="img/icon-pencil.png"><span class="button_text">Event Bewerten</span></a> 
    <br> 
    <a class="menu_button" onclick="location='photos.html?stadt='+stadt+'&id='+eventID;" data-role="button"><img src="img/icon-photos.png"><span class="button_text">Fotos ansehen</span></a> 
    <a class="menu_button" onclick="location='upload_photo.html?stadt='+stadt+'&id='+eventID;" data-role="button"><img src="img/icon-upload-photo.png"><span class="button_text">Foto hochladen</span></a> 
    <br> 
    <a class="menu_button" onclick="location='music.html?stadt='+stadt+'&id='+eventID;" data-role="button"><img src="img/icon-note.png"><span class="button_text">Musikwunsch</span></a> 

</div><!-- /panel --> 

    <!-- header --> 
    <div data-role="header" data-position="fixed" id="header"> 
    <a href="#panel" data-role="button" data-icon="bars" data-iconpos="notext" data-inline="true"></a> 
    <h1 id="headline">Event Bewerten</h1> 
    </div> 
    <!-- /header --> 

    <!-- content --> 
    <div data-role="content"> 
    <div id="review"> 
     <h3>wie gefällt es dir hier?</h3> 
     <div id="star"></div><br> 
     <form> 
      <label for="textarea-1">Schreib etwas über das Event:</label> 
      <textarea cols="40" style="height:150px;" rows="10" name="textarea-1" id="textarea-1"></textarea> 
     </form> 
     <a onclick="submitReview(eventID, stadt)" data-role="button" data-theme="b">Feedback abgeben</a> 
    </div> 
    </div> 
    <!-- /content --> 

<div data-role="footer" data-position="fixed">  

</div><!-- /footer --> 

</div> 
<!-- /page --> 

</body> 
</html> 
+0

如果您正在使用jQuery ,爲什麼你使用'onclick'的HTML屬性?相反,使用jQuery的'on()'方法...至於獲取星星,你還沒有包含任何代碼來顯示星星來自哪裏! –

回答

0

我明白了!我使用的插件click: function(score, evt){}

回調的Funktion這是我的標記:

<script> 
    $(document).delegate('#menu', 'pageshow', function() { 
     $('#star').raty({ 
      click: function(score, evt) { 
      $("#submit_button_review").click(function(){ 
       submitReview(eventID, stadt, score); 
      }); 
      } 
     }); 
     stadt = GetURLParameter('stadt'); 
     document.getElementById('deinestadt').value = stadt; 
     id = GetURLParameter('id'); 
     getEventFromId(id); 
     getEventText(id); 
     eventID = GetURLParameter('id'); 

    }); 
</script> 

和按鈕:

<a id="submit_button_review" data-role="button" data-theme="b">Feedback abgeben</a> 

感謝您的幫助;)

0

我剛看到這個插件具有隱藏價值命名成績,它具有明星的slected的計數..

給的一個或一個類,如:.button

$("a.button").click(function(){ 
    //Lets say, the Stars are next element to the <a> 
    var stars = $(this).next().find("input[name='score']").val(); 
    submitReview(eventID, stadt, stars); 
}); 

Didnt測試它。它很難沒有標記... 希望它有幫助...

+0

我發佈了上面的標記! thx爲您的答案 – m1crdy