控制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酒吧的值

回答

相关问题