为什么我的JavaScript三元运算符不起作用？

Question

<script type="text/javascript">
    $(document).ready(function () {

        $('[type=button]').click(function () {
            var modelcount = $('#modelcount').val();
            modelcount++;
            if (modelcount >= 10) {
                $("#prodform").prepend('<div class="validation-summary-errors"><ul><li>Only 10 serial numbers can be added</li></ul></div>');
                $('[type=button]').attr("disabled", "disabled");
                $('[type=button]').removeClass().addClass('disabled');
            }
            else { //THIS BIT HERE!!!!!
                $(".entry").last().after().append('<div class="entry"><label for="HandHeldProducts_' + modelcount + '__SerialNumber">Serial Number</label><input' + ($.MyFunction($("#BothProducts"))) ? 'disabled = "disabled"' : '' + ' class="serial" id="HandHeldProducts_' + modelcount + '__SerialNumber" name="HandHeldProducts[' + modelcount + '].SerialNumber" placeholder="Serial Number" type="text" value="" /></div>')
                $('#modelcount').val(modelcount);
            }
        });

        $.MyFunction = function (elemnt) {
            return (elemnt.attr("checked") != "undefined" && elemnt.attr("checked") == "checked");
        };

    });
</script>

Answer 1

你在做什么 :

$(".entry").last().after().append(
    '<div class="entry"><label for="HandHeldProducts_' + 
    modelcount + 
    '__SerialNumber">Serial Number</label><input' +
    ($.MyFunction($("#BothProducts"))) ? 
        'disabled = "disabled"' : 
        '' + ' class="serial" id="HandHeldProducts_' + 
            modelcount + 
            '__SerialNumber" name="HandHeldProducts[' + 
            modelcount + 
            '].SerialNumber" placeholder="Serial Number" type="text" value="" /></div>'
)

基本上,你的字符串连接的其余部分位于三元组的"else"块中

为了避免这种情况,请将您的tenary包在括号中

你想做什么 :

$(".entry").last().after().append(
    '<div class="entry"><label for="HandHeldProducts_' + 
    modelcount + 
    '__SerialNumber">Serial Number</label><input' +
    (($.MyFunction($("#BothProducts"))) ? 
        'disabled = "disabled"' : 
        '') + 
    ' class="serial" id="HandHeldProducts_' + 
    modelcount + 
    '__SerialNumber" name="HandHeldProducts[' + 
    modelcount + 
    '].SerialNumber" placeholder="Serial Number" type="text" value="" /></div>'
)

真正的问题

像这样的字符串连接是*****.使用DOM或使用模板.

下面是DOM :( 未经测试)

$(".entry").last().after().append(
    $("<div></div>", {
        "class": "entry"    
    }).append(
        $("<label></label>", {
            "label": "HandHeldProducts_" + modelcount + "__SerialNumber"
            "text": "Serial Number"
        })  
    ).append(
        $("<input/>", {
            "class": "serial",
            "id": "HandHeldProducts_" + modelcount + "__SerialNumber"
            "name": "HandHenldProducts[" + modelcount + "].SerialNumber",
            "placeholder": "Serial Number",
            "type": "text",
            "value": ""
        })
    )
);

if ($.MyFunction($("#BothProducts")) {
    $("#HandHeldProducts_" + modelcount + "__SerialNumber").attr("disabled", "disabled");
}