JS Star评级如何获得MYSQL的<span>值?

时间:2017-08-09 04:39:19

标签: javascript php html mysql twitter-bootstrap

来源:GitHub Dobtco starrr JS plugin

使用此插件供用户查看不同领域的公司&amp;将数据存储在MySQL数据库中。

已更新:我编辑了javascript文件,将该星号用于2个不同的评论字段,供多种用途使用。

编码部分:更新了K Scandrett

<form method="post" name="review" action="<?php echo esc_url($_SERVER['PHP_SELF']); ?>">
  <div id="collapse1" class="panel-collapse collapse">
<div class="panel-body">
        <div class="form-group">
    Review 1: <div id="stars_1" class="starrr" name ="rv_1" data-rating=<?php echo $rv_1 ?> ></div>  
    You gave a rating of <span id="count">0</span> star(s)
    <input type="hidden" class="form-control" id="rv_1" name="rv_1" value="2" />
        </div>
        <div class="form-group">
    Review 2: <div id="stars_2"  class="starrr" name ="rv_2" data-rating=<?php echo $rv_2 ?>></div>  
    You gave a rating of <span id="count_2">0</span> star(s)
    <input type="hidden" class="form-control" id="rv_2" name="rv_2" value="4" />
        </div>
  </div>
      <input type="hidden" value="<?php $user_id ?>" name ="user_id_review"/>
      <input type="hidden" value="<?php $company_id ?>" name ="company_id"/>
      <div class="panel-footer"><button type="submit" class="btn btn-default" name="review">Save</button></div>
  </div>
    </form>

1 个答案:

答案 0 :(得分:1)

当您阅读/更新input使用val()时。

当您阅读/更新span使用text()时(除非它包含您要包含的HTML)。

注意:您错过了echovalue="<?php $user_id ?>"中的value="<?php $company_id ?>命令。

&#13;
&#13;
$(function() {

  var $s1Input = $('#rv_1');
  var $s2Input = $('#rv_2');

  $('#stars_1').starrr({
    rating: $s1Input.val(),
    change: function(e, value) {
      $('#count').text(value);
      $s1Input.val(value);
    }
  });

  $('#stars_2').starrr({
    rating: $s2Input.val(),
    change: function(e, value) {
      $('#count_2').text(value);
      $s2Input.val(value);
    }
  });
});
&#13;
.starrr {
  display: inline-block;
}

.starrr a {
  font-size: 16px;
  padding: 0 1px;
  cursor: pointer;
  color: #FFD119;
  text-decoration: none;
}
&#13;
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://dobtco.github.io/starrr/dist/starrr.js"></script>
<div class="form-group">
  Review 1:
  <div id="stars_1" class="starrr"></div>
  You gave a rating of <span id="count">0</span> star(s)
  <input type="text" class="form-control" id="rv_1" name="rv_1" value="2" />
</div>
<div class="form-group">
  Review 2:
  <div id="stars_2" class="starrr"></div>
  You gave a rating of <span id="count_2">0</span> star(s)
  <input type="text" class="form-control" id="rv_2" name="rv_2" value="4" />
</div>
&#13;
&#13;
&#13;