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 回答