0

jquery Raty プラグインを必要とする方法を見つけようとしています。ユーザーが星をクリックしたことを確認するための簡単な方法を知っている人はいますか? 誰かがコードの一部を見る必要がある場合は、私に尋ねてください。私はまだjqueryに慣れていないので、詳細を教えていただきありがとうございます。

    $rates.raty({
        half: false,
        target : '#add_post_rating',
        hints: pixreviews.hints,
        path: path,
        targetKeep : true,
        //targetType : 'score',
        targetType : 'hint',
        //precision  : true,
        score: default_rating,
        scoreName: 'pixrating',
        click: function(rating, evt) {

            $('#add_post_rating' ).val( '' + rating );
            $('#add_post_rating option[value="' + rating + '"]' ).attr(  'selected', 'selected' );

        },
        starType : 'i'
    });
4

1 に答える 1

1

あなたが定義したので：

scoreName: 'pixrating'

Raty は、div 内に入力タイプの非表示フィールドを作成します。このフィールドを考慮する必要があります。

私の例とフィドル：

$(function () {
  $('div').raty({
    half: false,
    hints: ['bad', 'poor', 'regular', 'good', 'gorgeous'],
    path: 'https://raw.githubusercontent.com/wbotelhos/raty/master/lib/images/',
    targetKeep: true,
    //targetType : 'score',
    targetType: 'hint',
    //precision  : true,
    score: 0,
    scoreName: 'pixrating',
    click: function (rating, evt) {
      $('#add_post_rating').val(rating);
    },
    starType: 'i'
  });

  // handle the select box changes
  $('#add_post_rating').on('change', function (e) {
    $('div input[name="pixrating"]').val(this.value);
    $('div').raty('score', this.value);
  }).trigger('change');

  // on form submit do your test....
  $('#frm').on('submit', function(e) {
    if ($('div').raty('score') == '0') {
      e.preventDefault();
      console.log('error: raty is 0!');
      return;
    }
  })
});
<link rel="stylesheet" href="https://rawgit.com/wbotelhos/raty/master/lib/jquery.raty.css">
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script src="https://rawgit.com/wbotelhos/raty/master/lib/jquery.raty.js"></script>

<form id="frm">
    <div></div>
    <select id="add_post_rating">
        <option value="0"></option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
    </select>
    <input type="submit" value="Submit">
</form>

于 2016-08-24T19:00:09.450 に答える