Question

我的需要是仅在条件为真时生成具有指定参数的按钮。我该如何检查？如下所示，此时生成的按钮不会检查条件。请帮我正确的语法。

json代码：

{
    "Caption": "Module caption",
    "IconsDirectory": "C://Images/",
    "Buttons": [
        {
        "Conditions": [
            {
            "ConditionText": "2 == 1",
            "ButtonText": "Text_11",
            "Visible": true,
            "Colors": {
                "FontColor": "#FFFFFF",
                "BGColor": "#669933"
            },
            "BButtonText": {
                "TText": "Textt_1"
            },
            "Size": {
                "Width": 200,
                "Height": 50
            },
            "Icon": {
                "FileName": "Smile.png",
                "Width": 16,
                "Height": 16
            },
            "Url": {
                "UrlAddress": "http://www.google.com",
                "OpenNewWindow": true
            },
            "JavaScriptAction": {
                "TText": "alert('ok1');"
            }},
        {
            "ConditionText": "2 == 2",
            "ButtonText": "Text_22",
            "Visible": true,
            "Colors": {
                "FontColor": "#0FFFFF",
                "BGColor": "#FF9966"
            },
            "BButtonText": {
                "TText": "Textt_1"
            },
            "Size": {
                "Width": 200,
                "Height": 50
            },
            "Icon": {
                "FileName": "Smile.png",
                "Width": 16,
                "Height": 16
            },
            "Url": {
                "UrlAddress": "http://www.google.com",
                "OpenNewWindow": true
            },
            "JavaScriptAction": {
                "TText": "alert('ok2');"
            }}
        ]}
    ]
}

html代码：

<!DOCTYPE html>
<html>
<head>
<title>SMButtons</title>
<script src="jquery/jquery-1.4.2.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $.getJSON('weekendtask.json', function(data) {
    var res = ""
    $.each(data.Buttons, function(key, button) {
        $.each(button.Conditions, function(key, condition) {
            res += "<li>"
            res += '<input type="button"' + '" value="' + condition.BButtonText.TText 
            res += '" onclick="' + condition.JavaScriptAction.TText 

            //background color
            res += '" style=" background-color:' + condition.Colors.BGColor 

            //font color
            res += '; color:' + condition.Colors.FontColor 

            res += '"/>'
            res += "<\/li>"
        })
    })
    $(res).appendTo('#ulObj')
});
});
</script>
</head>
<body>
<div>
<ul id='ulObj'>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
</body>
</html>

Answer 1

您可以通过执行以下操作检查Visible值：

$.each(data.Buttons, function(key, button) {
    $.each(button.Conditions, function(key, condition) {
       // check the visible value
       if (condition.Visible) {
         res += "<li>"
         res += '<input type="button"' + '" value="' + condition.BButtonText.TText 
         res += '" onclick="' + condition.JavaScriptAction.TText 

         //background color
         res += '" style=" background-color:' + condition.Colors.BGColor    

         //font color
         res += '; color:' + condition.Colors.FontColor 

         res += '"/>'
         res += "<\/li>"
       }
    })
})

由于条件（true或false），jquery + json生成按钮

1 个答案: