0

スライダーを動かしたときに表示値を更新する以下の JavaScript 関数があります。ただし、現在、ボタンのクリック時にのみ値を更新する予定です。これがJavaScript関数です。

.on("slider:ready slider:changed", function (event, data) {
            var $output =$(this).nextAll(".output:first");
            $output.html(data.value.toFixed(2));
            masterData[$output.attr("id").replace(/output/,"")] = data.value;
            $("#kwBody > tr").each(function() {
               var $cells = $(this).children("td");

               var found=false,count=0,currentCell;
               for (var i=0;i<masterData.length;i++) {
                 currentCell=$cells.eq(i+1);
                 found = parseInt(currentCell.text(),10) >=masterData[i];
                 currentCell.toggleClass("found",found); //add or remove class to highlight 
                 count+=found;
               }
               window.console && console.log(masterData,count);
               $(this).toggle(count==masterData.length); // show if all cells >

            });
        });
});

以下のようなボタンをデザインしました。

 <button onclick="myFunction()">Display!</button>

myfunction() 内に上記の JavaScript 関数を含めました。ただし、ボタンをクリックしても更新は行われません。実際の例はここにあります。

編集：

  <h2>Keyword Scores</h2>
  <?php

$i = 0;
while (++$i <= $_SESSION['totalcolumns']-1) {
isset($_GET["slider$i"]) ? $rangevalue=$_GET["slider$i"] : $rangevalue="";
    $range = $_SESSION["min-column-$i"] . ',' . $_SESSION["max-column-$i"];?>
        <br><?php echo "Keyword" ?>
        <?php echo $i ?>
        <br><input type="text" data-slider="true" id="slider<?php echo $i; ?>" data-slider-range="<?php echo $range ?>" autocomplete="off" value="<?php echo $rangevalue; ?>" data-slider-step="1">
        <meta http-equiv="refresh">
        <?php } ?>  



<script>
4

1 に答える 1

1

ボタンに「id」属性を追加します。「myButton」だとします。今、

  1. var masterData はグローバルであると想定しています

  2. スライダー リスナーを次のように変更します。

    .on("slider:ready slider:changed", function (event, data) {
    var $output =$(this).nextAll(".output:first");
    $output.html(data.value.toFixed(2));
    masterData[$output.attr("id").replace(/output/,"")] = data.value;   
 });

  3. ボタンのクリック リスナーを作成する

    $("#myButton").click(function (){
       $("#kwBody > tr").each(function() {
          var $cells = $(this).children("td");
          var found=false,count=0,currentCell;
           for (var i=0;i<masterData.length;i++) {
             currentCell=$cells.eq(i+1);
             found = parseInt(currentCell.text(),10) >=masterData[i];
             currentCell.toggleClass("found",found); //add or remove class to highlight 
             count+=found;
        }
       window.console && console.log(masterData,count);
       $(this).toggle(count==masterData.length); // show if all cells >

    });
});

  4. 各ページの読み込み時にボタンのクリックをシミュレートします。

     $(document).ready(function(){
   $("#myButton").click();
 });

試したことはありませんが、うまくいくことを願っています。

于 2013-11-01T15:47:40.150 に答える