即使在更新頁面後，如何保持星級評分

Question

我已經在wordpress（後端）中使用jQuery創建了5星評級系統插件。星級值也在更新後發佈元表。如果我給了一個帖子3星級並更新頁面，該值將存儲在後元，但更新頁面後，評級將不會顯示。所以我的問題是如何在更新頁面之後保存這些值直到我們手動編輯星級評分。

<?php 

/* Plugin Name: Star Rating 
* Version: 1.0 
*/ 

class starrating{ 

    public function __construct(){ 
    add_action('add_meta_boxes',array($this,'my_meta')); 
    add_action('admin_enqueue_scripts',array($this ,'starscript')); 
    add_action('save_post', array($this,'save_field')); 
    } 


    public function my_meta() 

    { 

     add_meta_box(
     'my_custom_meta', 
     'Created By', 
     array($this,'my_meta_box_mes'), 
     'a_z', 
     'side', 
     'low' 
    ); 

    } 

    public function save_field($post_id) 

    { 
    update_post_meta($post_id,'starrating',$_POST['rating']);  
} 


    public function my_meta_box_mes() 
    { 

    ?> 
    <label>Please Rate Your Ratings !!</label> 
    <p> 
    <input type="hidden" name="rating" id="rating" /> 
<ul class="rating" onMouseOut="resetRating();"> 
    <li name="star" value="one" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
    <li name="star" value="two" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
    <li name="star" value="three" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
    <li name="star" value="four" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
    <li name="star" value="five" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
</ul> 
    </p> 



    <?php 
    } 
    public function starscript(){ 
    wp_enqueue_script('star_id',content_url() . '/plugins/star_rating/js/starrating.js'); 
    wp_enqueue_script('jquery_id', 'https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js'); 
    wp_enqueue_style('styl_id',content_url() . '/plugins/star_rating/css/star.css'); 

    } 
} 
$star=new starrating(); 

?> 

Answer 1

如果post meta已經存在，請檢入「my_meta_box_mes」方法。 如果存在改變html代碼。

我爲您編寫代碼，但它只是舉例。 它會起作用，但，這是一個不好的做法，做到這一點：

public function my_meta_box_mes(){ 
?> 
    <label>Please Rate Your Ratings !!</label> 
    <p> 
    <input type="hidden" name="rating" id="rating" /> 
<ul class="rating" onMouseOut="resetRating();"> 
    <li name="star" value="one" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
    <li name="star" value="two" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
    <li name="star" value="three" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
    <li name="star" value="four" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
    <li name="star" value="five" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);">&#x2605;</li> 
</ul> 
    </p> 
<?php 

    // Get current rating value 
    $currentRating = get_post_meta(get_the_ID(), 'starrating', true); 
    if($currentRating){ 
     // trigger click event with js on the current star value 
     ?> 
     <script> 
      document.querySelector("ul.rating li[value='<?php echo $currentRating; ?>']").click(); 
     </script> 

     <?php 
    } 

} 

Answer 2

public function my_meta_box_mes() 
    { 
     $star=(int)get_post_meta($_GET['post'],'starrating',true); 
     //var_dump($star);exit(); 

    ?> 
    <label>Please Rate Your Ratings !!</label> 
    <p> 
    <input type="hidden" name="rating" id="rating" /> 
<ul class="rating" onMouseOut="resetRating();"> 
    <?php for($i=0;$i<5;$i++){ 
     if($i<$star) 
      { 
       $classz="selected"; 
      } 
      else { 
       $classz=""; 
      } 
     ?> 
    <li name="star" value="one" onmouseover="highlightStar(this);" onmouseout="removeHighlight();" onclick="addRating(this);" class="<?=$classz?>">&#x2605;</li> 

    <?php 

    } 

    ?>