控制jQuery酒吧的值

如何檢查jQuery中進度條的值？比方說，我按下一個按鈕，它關係到50％，如果我把25％的按鈕，我想獲得它說控制jQuery酒吧的值

<!DOCTYPE HTML> 
<html> 

<head> 
    <link rel="shortcut icon" href="../test/pics/bbti.png" /> 
    <title>Bing Bang Theory</title> 
    <link rel="stylesheet" type="text/css" href="../test/css/style2.css"> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css"> 
    <script src="http://code.jquery.com/jquery-1.11.1.js"></script> 
    <script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js"></script> 

</head> 

<body> 

    <h1>bbt</h1> 
    <!--progress bar start--> 
    <div id="progressbar"></div> 
    <br /> 
    <button onclick="set25()">Set to 25%</button> 

    <button onclick="set50()">Set to 50%</button> 

    <button onclick="set75()">Set to 75%</button> 

    <button onclick="set100()">Set to 100%</button> 

    <script> 
    $(function() { 
     $("#progressbar").progressbar({ 
     value: 0 
     }); 
    }); 
    // Set progressbar to 25% 
    function set25() { 
     //somewhere here is the code about if statement. 
     $("#progressbar").progressbar("option", "value", 25); 
    } 
    // Set progressbar to 50% 
    function set50() { 
     $("#progressbar").progressbar("option", "value", 50); 
    } 
    // Set progressbar to 75% 
    function set75() { 
     $("#progressbar").progressbar("option", "value", 75); 
    } 
    // Set progressbar to 100% 
    function set100() { 
     $("#progressbar").progressbar("option", "value", 100); 
    } 
    </script> 
    <!--progress bar stops--> 

</body> 

</html>

你能幫助「你不能低於50％進入」警報我解決它？謝謝。

來源

2015-06-28 Vagg

您可以使用一個單一的功能來執行操作。你可以避免內聯JS，這可能是一個噩夢來維護。

$(function() { 
 
    $("#progressbar").progressbar({ 
 
     value: 0 
 
    }); 
 
    $('button[data-value]').on('click',function() { 
 
     var pbar = $('#progressbar'), 
 
      value = $(this).data('value'), 
 
      curValue = pbar.progressbar('value'); 
 
     if(value < curValue) { 
 
      alert("You can't go under " + curValue +"%!"); 
 
     } else { 
 
      pbar.progressbar('value', value); 
 
     } 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> 
 
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css"> 
 
<div id="progressbar"></div> 
 
<br /> 
 
<button data-value="25">Set to 25%</button> 
 
<button data-value="50">Set to 50%</button> 
 
<button data-value="75">Set to 75%</button> 
 
<button data-value="100">Set to 100%</button>

來源

2015-06-28 16:39:22 PeterKA

而不是有像set25，set50 ...這樣的多個函數有一個函數並向它發送值。事情是這樣的

function set(progressBarValue){}

，並調用它像這樣

<button onclick="set(25)">Set to 25%</button> 
<button onclick="set(50)">Set to 50%</button> 
<button onclick="set(75)">Set to 75%</button> 
<button onclick="set(100)">Set to 100%</button>

爲了得到一個進度條的當前值，你可以做到這一點

$("#progressbar").progressbar("option", "value");

整體而言，這應該是這個樣子此

var myprogressbar; 
$(document).ready(function() { 
    myprogressbar = $("#progressbar").progressbar({ 
     value: 0 
    }); 
}); 

function set(val) { 
    var currVal = myprogressbar.progressbar("option", "value"); 
    if(currVal > val){ 
     alert('Cannot go lower'); 
     return; 
    } 
    myprogressbar.progressbar("option", "value", val); 
}

這裏是演示http://jsfiddle.net/dhirajbodicherla/NAs3V/381/

來源

2015-06-28 16:24:11 Dhiraj

控制jQuery酒吧的值

回答

相關問題