javascript - 如何在 Jquery 未捕获异常中修复此错误：语法错误，无法识别的表达式：语法错误，无法识别的表达式：标签

Question

所以我有这个在我的 Jquery 中调用的函数，在模糊事件上调用 updateField .. 控制台返回这个错误

 uncaught exception: Syntax error, unrecognized expression: Syntax error, unrecognized expression: label

问题出在哪里 ？我好像找不到

下面是HTML代码

<li>
    <label for="element_label" class="desc">Field Label</label>
    <textarea class="textarea" id="element_label" onBlur="updateField()"></textarea>
</li>
<li id="prop_element_name" style="display: block;">
    <label for="element_names" class="desc">Field Name</label>
    <select id="element_names" name="element_names" onBlur="updateField()">
        <?php
        if ($master_elements = query("SELECT * FROM master_elements WHERE field_type != 'scrubbed_data' ORDER BY element_label")) {
            foreach ($master_elements as $idx=>$element) {
                echo "<option value=\"{$element['masterid']}\">{$element['element_label']}</option>";
            }
        }
        ?>
    </select>


    <a href="javascript:;" id="new_element_name_lnk" title="New Field Name"><img src="/img/form_builder/add.gif" /></a>

</li>

下面是被调用的 updateField 函数

function updateField(option) {
    if (option) {
        input_id = $("li.current_edit").attr("id").replace(/li_/, "");
        $("li.current_edit :input#masterid_" + input_id).val( option.element_masterid );
        $("li.current_edit :input#type_" + input_id).val( option.element_type );
        $("li.current_edit :input#name_" + input_id).val( option.element_name );
        $("li.current_edit :input#validation_" + input_id).val( option.element_validation );
        $("li.current_edit :input#label_" + input_id).val( option.element_label );
        $("li.current_edit :input#guidelines_" + input_id).val( option.element_guidelines );
        $("li.current_edit :input#size_" + input_id).val( option.element_size );
        $("li.current_edit :input#options_" + input_id).val( option.element_custom_options );
        $("li.current_edit :input#format_" + input_id).val( option.element_format );
        $("li.current_edit :label#title_" + input_id).html(option.element_label);

        display_field_properties();
        updateField();
        return false;
    }
    else {
        input_id = $("li.current_edit").attr("id").replace(/li_/, "");

        inputtype = $("li.current_edit :input#type_" + input_id).val();
        $("li.current_edit :input#type_" + input_id).val(inputtype);

        label = $("#element_properties").find("#element_label").val();
        validation = $("#element_properties").find("#element_validation").val();
        required = $("#element_properties").find("#element_required").attr("checked");

        if (required) {
            $("li.current_edit :input#validation_" + input_id).val('required,' + validation);
            $("li.current_edit :label#title_" + input_id).html(label);
            $("li.current_edit :label#title_" + input_id).append('<font class="required"> *</font>');
        }
        else {
            $("li.current_edit :input#validation_" + input_id).val(validation);
            $("li.current_edit :label#title_" + input_id).html(label);
        }
        $("li.current_edit :input#label_" + input_id).val(label);


        var name = $("#element_properties :input#element_names").val();
        $("li.current_edit :input#name_" + input_id).val(name);
        $("li.current_edit :input#masterid_" + input_id).val(name);

        options = $("#element_properties").find("#element_options").val();
        $("li.current_edit :input#options_" + input_id).val(options);

        guidelines = $("#element_properties").find("#element_guidelines").val();
        $("li.current_edit :input#guidelines_" + input_id).val(guidelines);
        $("li.current_edit div#hint_" + input_id).html(guidelines);

        if (inputtype == "date") {
            // str = format,input
            str = $("#date_format").val() + "|" + $("#date_input_type").val();
            $("li.current_edit :input#format_" + input_id).val( str );
            var str = '<a title="Click to edit. Drag to reorder." onclick="return false;" class="hover_ready" href="#">';
            str = str + '<label id="title_' + input_id + '" class="desc">' + label + '</label>';
            str = str + '<div>';

            if ($("#date_input_type").val() == "select") {
                var dd_options = '<option value="1">1</option>';
                dd_options = dd_options + '<option value="2">2</option>';
                dd_options = dd_options + '<option value="3"> .. </option>';
                dd_options = dd_options + '<option value="31">31</option>';
                var mm_options = '<option value="1">1</option>';
                mm_options = mm_options + '<option value="2">2</option>';
                mm_options = mm_options + '<option value="3"> .. </option>';
                mm_options = mm_options + '<option value="12">12</option>';
                var d = new Date();
                curyear = d.getFullYear();
                var yy_options = "";
                for (ii=curyear; ii < curyear+10; ii++) {
                    yy_options = yy_options + '<option value="' + ii + '">' + ii + '</option>';
                }
                if ($("#date_format").val() == "date") {
                    str = str + '<span><select id="field_' + element_idx + '_0 style="width:3em">' + mm_options + '</select> / <label>MM</label></span>';
                    str = str + '<span><select id="field_' + element_idx + '_1 style="width:3em">' + dd_options + '</select> / <label>DD</label></span>';
                    str = str + '<span><select id="field_' + element_idx + '_2 style="width:5em">' + yy_options + '</select> <label>YYYY</label></span>';
                }
                else if ($("#date_format").val()  == "europe_date") {
                    str = str + '<span><select id="field_' + element_idx + '_1 style="width:3em">' + dd_options + '</select> / <label>DD</label></span>';
                    str = str + '<span><select id="field_' + element_idx + '_0 style="width:3em">' + mm_options + '</select> / <label>MM</label></span>';
                    str = str + '<span><select id="field_' + element_idx + '_2 style="width:5em">' + yy_options + '</select> <label>YYYY</label></span>';
                }
                else {
                    str = str + '<span><select id="field_' + element_idx + '_2 style="width:5em">' + yy_options + '</select> - <label>YYYY</label></span>';
                    str = str + '<span><select id="field_' + element_idx + '_0 style="width:3em">' + mm_options + '</select> - <label>MM</label></span>';
                    str = str + '<span><select id="field_' + element_idx + '_1 style="width:3em">' + dd_options + '</select> <label>DD</label></span>';
                }
            }
            else {
                if ($("#date_format").val() == "date") {
                    str = str + '<span><input type="text" size="2" id="field_' + element_idx + '_0' + '" class="text" readonly="readonly"/> / <label>MM</label></span>';
                    str = str + '<span><input type="text" size="2" id="field_' + element_idx + '_1' + '" class="text" readonly="readonly"/> / <label>DD</label></span>';
                    str = str + '<span><input type="text" size="4" id="field_' + element_idx + '_2' + '" class="text" readonly="readonly"/> <label>YYYY</label></span>';
                }
                else if ($("#date_format").val()  == "europe_date") {
                    str = str + '<span><input type="text" size="2" id="field_' + element_idx + '_1' + '" class="text" readonly="readonly"/> / <label>DD</label></span>';
                    str = str + '<span><input type="text" size="2" id="field_' + element_idx + '_0' + '" class="text" readonly="readonly"/> / <label>MM</label></span>';
                    str = str + '<span><input type="text" size="4" id="field_' + element_idx + '_2' + '" class="text" readonly="readonly"/> <label>YYYY</label></span>';
                }
                else {
                    str = str + '<span><input type="text" size="4" id="field_' + element_idx + '_2' + '" class="text" readonly="readonly"/> <label>YYYY</label></span>';
                    str = str + '<span><input type="text" size="2" id="field_' + element_idx + '_0' + '" class="text" readonly="readonly"/> - <label>MM</label></span>';
                    str = str + '<span><input type="text" size="2" id="field_' + element_idx + '_1' + '" class="text" readonly="readonly"/> - <label>DD</label></span>';
                }
            }
            str = str + '</div>';
            str = str + '</a>';
            $("li.current_edit a").replaceWith(str);
        }
        else if (inputtype == "time") {
            // str = hh(format,period),mm(format,period),ss(format,period)
            str = $("#hour_format").val() + "|" + $("#hour_period").val() + ",";
            str = str + $("#minute_format").val() + "|" + $("#minute_period").val() + ",";
            // str = str + $("#second_format").val() + "|" + $("#second_period").val();
            $("li.current_edit :input#format_" + input_id).val( str );

            var str = '<a title="Click to edit. Drag to reorder." onclick="return false;" class="hover_ready" href="#">';
            str = str + '<label id="title_' + input_id + '" class="desc">' + label + '</label>';
            str = str + '<div>';

            if ($("#hour_format").val() == "select") {
                str = str + '<span><select style="width: 6em;" id="field_' + input_id + '_0' + '" class="select">';
                if ($("#hour_period").val() == 12) {
                    str = str + '<option value="1AM">1 AM</option>';
                    str = str + '<option value="2AM">2 AM</option>';
                    str = str + '<option value="1PM"> .. </option>';
                    str = str + '<option value="1PM">12 PM</option>';
                }
                else if ($("#hour_period").val() == 24) {
                    str = str + '<option value="100">1</option>';
                    str = str + '<option value="200">2</option>';
                    str = str + '<option value="2300"> .. </option>';
                    str = str + '<option value="2400">24</option>';
                }
                str = str + '</select> : <label>HH</label></span>';
            }
            else {
                str = str + '<span><input type="text" size="2" id="field_' + input_id + '_0' + '" class="text" readonly="readonly"/> : <label>HH</label></span>';
            }

            if ($("#minute_format").val() == "select") {
                str = str + '<span><select style="width: 4em;" id="field_' + input_id + '_1' + '" class="select">';
                if ($("#minute_period").val() == 5) {
                    str = str + '<option value="0">0</option>';
                    str = str + '<option value="5">5</option>';
                    str = str + '<option value="50"> .. </option>';
                    str = str + '<option value="55">55</option>';
                }
                else if ($("#minute_period").val() == 10) {
                    str = str + '<option value="0">0</option>';
                    str = str + '<option value="10">10</option>';
                    str = str + '<option value="40"> .. </option>';
                    str = str + '<option value="50">50</option>';
                }
                else if ($("#minute_period").val() == 15) {
                    str = str + '<option value="0">0</option>';
                    str = str + '<option value="15">15</option>';
                    str = str + '<option value="30">30</option>';
                    str = str + '<option value="45">45</option>';
                }
                str = str + '</select> <label>MM</label></span>';
            }
            else {
                str = str + '<span><input type="text" size="2" id="field_' + input_id + '_1' + '" class="text" readonly="readonly"/> : <label>MM</label></span>';
            }
            /*
            if ($("#second_format").val() == "select") {
                str = str + '<span><select style="width: 4em;" id="field_' + input_id + '_2' + '" class="select">';
                str = str + '<option value="0">0</option>';
                str = str + '<option value="30">30</option>';
                str = str + '</select><label>SS</label></span>';
            }
            else {
                str = str + '<span><input type="text" size="2" id="field_' + input_id + '_2' + '" class="text" readonly="readonly"/><label>SS</label></span>';
            }
            */
            str = str + '</div>';
            str = str + '</a>';
            $("li.current_edit a").replaceWith(str);
        }
        else if (inputtype == "address") {
            $("li.current_edit :input#format_" + input_id).val($("#address_format").val());
            var str = "";
            if ($("#address_format").val() == "us") {
                str = '<div class="right" id="field_' + input_id + '_state">';
                str = str + '<select id="field_' + element_idx + '_3" class="select medium" >';
                str = str + '<option value="AL">Alaska</option>';
                str = str + '</select><label>State</label>';
                str = str + '</div>';
            }
            else {
                str = '<div class="right" id="field_' + input_id + '_state">';
                str = str + '<input type="text" id="field_' + element_idx + '_3" class="text medium" readonly="readonly"/><label>Province / Region</label>';
                str = str + '</div>';
            }
            $("div#field_" + input_id + "_state").replaceWith(str);
        }
        else if (inputtype == "phone") {
            $("li.current_edit a div span").remove();
            var str = "";
            if ($("#phone_format").val() == "us_phone") {
                $("li.current_edit :input#format_" + input_id).val("us_phone");
                str = '<span><input type="text" size="3" class="text" id="field_' + element_idx + '_0' + '" readonly="readonly"/> - <label>(###)</label></span>';
                str = str + '<span><input type="text" size="3" class="text" id="field_' + element_idx + '_1' + '" readonly="readonly"/> - <label>###</label></span>';
                str = str + '<span><input type="text" size="4" class="text" id="field_' + element_idx + '_2' + '" readonly="readonly"/><label>####</label></span>';
                $("li.current_edit a div:first").append(str);
            }
            else {
                $("li.current_edit :input#format_" + input_id).val("international");
                str = str + '<span><input type="text" size="20" class="text" id="field_' + element_idx + '_0' + '" readonly="readonly"/></span>';
                $("li.current_edit a div:first").append(str);
            }
        }
        else if ( inputtype == "text" || inputtype == "textarea" || inputtype == "website" || inputtype == "email" || inputtype == "file") {
            size = $("#element_properties").find("#element_size").val();
            $("li.current_edit :input#size_" + input_id).val(size);
            $("li.current_edit :input").removeClass("small");
            $("li.current_edit :input").removeClass("medium");
            $("li.current_edit :input").removeClass("large");
            $("li.current_edit :input").addClass($("#element_size").val());
        }
        else if (inputtype == "radio" || inputtype == "checkbox" || inputtype == "select") {
            var result_str = "";
            if (inputtype == "select")  $("li.current_edit select").children().remove();
            else    $("li.current_edit span:children").children().remove();
            $("ul#element_choices li").each( function(i, ob) {
                chkchk = "";
                sel = "";
                result_str = result_str + $(ob).find(":input#choice_" + i + "_name").val() + '|';
                result_str = result_str + $(ob).find(":input#choice_" + i + "_value").val() + '|';

                if ($(ob).find("img.option_default").length > 0) {
                    result_str = result_str + 'default|';
                    chkchk = "checked";
                    sel = "selected";
                }
                else {
                    result_str = result_str + '0|';
                }

                if (inputtype == "radio") {
                    str = '<input type="radio" id="field_' + input_id + '_' + i + '" name="' + name + '" class="radio" ' + chkchk + ' /><label class="choice">' + $(ob).find(":input").val() + '</label>';
                    $("li.current_edit span").append(str);
                }
                else if (inputtype == "checkbox") {
                    str = '<input type="checkbox" id="field_' + input_id + '_' + i + '" name="' + name + '" class="checkbox" ' + chkchk + ' /><label class="choice">' + $(ob).find(":input").val() + '</label>';
                    $("li.current_edit span").append(str);
                }
                else if (inputtype == "select") {
                    str = '<option ' + sel + ' >' + $(ob).find(":input").val() + '</option>';
                    $("li.current_edit :input#field_" + input_id).append(str);
                }
            });
            $("input#options_"+input_id).val(result_str);
        }
        else if (inputtype == "states") {
            str = $("#state_format").val();
            $("li.current_edit :input#format_" + input_id).val( str );
        }
        else if (inputtype == "countries") {
            str = $("#country_format").val();
            $("li.current_edit :input#format_" + input_id).val( str );
        }
        else if (inputtype == "sectionstart" || inputtype == "sectionheader" || inputtype == "sectionend") {
            $("li.current_edit :input#masterid_" + input_id).val('0');
        }
        return false;
    }
}

Answer 1

您在语句中使用labelHTML 保留字作为变量名。else尝试将其更改为其他名称，看看会发生什么。