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>'
)

基本上，你的字符串连接的其余部分位于＆＃34; else＆＃34;三元块

为避免将您的遗嘱包在括号内。

你想做什么：

$(".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");
}

Answer 2

尝试将字符串分解为多个位以便于理解：

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

当我打破弦乐时我没有看到任何错误，但那里可能有一个备用括号。总而言之，我认为这里唯一的问题是线路长度过长 - 这种代码难以保持清洁，难以调试。

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

2 个答案: