Question

我有一个模式对话框（Bootstrap），它有一个list-group，里面有自定义list-group-items（从我的服务器添加数据后使用append填充循环）。

在每个list-group-item中，我有一个Checkbox，用于＆＃34;选择＆＃34;结果。当我填充项目时，我将JQuery click事件连接到相应的Checkbox：

            // Add to search results
            $('#search-results').append(
            '<a id="centroid-list-item-' + featureAttrs['ObjectID'] + '" href="\\#"' + 'class="list-group-item" style="outline: 0">' +
            '<table style="background: transparent">' +
                '<tr>' +
                    '<td>' +
                        '<input id="centroid-checkbox-' + featureAttrs['ObjectID'] + '" type="checkbox" value="">&nbsp;&nbsp;' +
                    '</td>' +
                    '<td>' +
                        '<h4 class="list-group-item-heading">' +
                            featureAttrs['UNIQUEID'] +
                        '</h4>' +
                        '<p id="centroid-item-text-' + featureAttrs['ObjectID'] + '"' + 'class="list-group-item-text">' +
                            featureAttrs['NAME'] +
                        '</p>' +
                    '</td>' +
                '</tr>' +
            '</table>' +
            '</a>'
            );
            // When the DOM is ready, add event
            $(document).ready(function () {
                $('#centroid-checkbox-' + featureAttrs['ObjectID']).click(function (event) {
                    var objectId = $(this).attr('id').replace(/^\D+/g, '');
                    console.log(objectId + " was clicked");
                    if ($(this).is(':checked')) {
                        // Enable the 'Set Target' button
                        $('#btn-set-target').removeAttr('disabled');
                        // Disable all other choices
                        $('[id^="centroid-checkbox-"]').each(function (event) {
                            console.log("Picked up values for checkboxes");
                            if ($(this).attr('id') != ('centroid-checkbox-' + objectId)) {
                                $(this).attr('disabled', true);
                            }
                        });
                    }
                    else {
                        $('#btn-set-target').attr('disabled', 'disabled');
                        // Enable all text boxes
                        $('[id^="centroid-checkbox-"]').each(function () {
                            if (this.attr('id') !== ('centroid-checkbox-' + objectId)) {
                                this.removeAttr('disabled');
                            }
                        });
                    }
                });
            });

我遇到的问题是，当我调用$('[id^="centroid-checkbox-"]')时，它返回undefined。然而，在被召唤的时候，大约有30＆＃34; centroid-checkbox-XXXXX＆＃34;复选框。我在这里做错了什么？

Answer 1

$函数永远不会返回undefined。

但是传递给this的回调中的each是一个元素，而不是一个jQuery对象。

这意味着您必须使用this.id代替this.attr('id')和$(this).removeAttr('disabled')而不是this.removeAttr('disabled')（您可能需要this.disabled=false或$(this).prop('disabled', false)）

Answer 2

objectId永远不会被定义，因为你需要引用你为replace（）使用的正则表达式：

var objectId = $(this).attr('id').replace(/^\D+/g, '');

应该是：

var objectId = $(this).attr('id').replace('/^\D+/g', '');

DEMO：http://jsfiddle.net/4fUvn/8/

JQuery“属性开始于”选择器未定义

2 个答案: