无法读取jquery选择器元素的null属性'parentNode'

时间:2014-12-10 20:17:41

标签: javascript jquery combobox

我需要为列表创建一个可编辑的组合框,我使用_将模板加载到js文件中。在创建一个新的ComboBox对象时,我使用jquery选择器来选择元素但是我得到一个无法读取的属性' parentNode' null错误。

这是Javascript:

var deps = [
'jquery', 'underscore', 'lib/combobox', 'dialogs/FlowNode',
'text!dialogs/choose-feature.html'
];

define(deps, function($, _, combobox, FlowNode, ChooseFeatureTmpl) {

var ChooseFeatureTemplate = _.template(ChooseFeatureTmpl);
    return {
    create: function(transition) {
        var node = FlowNode.create(ChooseFeatureTemplate, transition);
        // add the controls onto the FlowNode for displaying
        // the limiting of features

        $(node).on('render', function() {
            var typecombo = new ComboBox($('input[name="select-type"]'));
            var organism_selector = '#' + node.uid() + ' select[name="select-organism"]';
            var type_selector = '#' + node.uid() + ' input[name="select-type"]';
            var feature_selector = '#' + node.uid() + ' select[name="select-feature"]';


            var changeFn = function() {
                var organism = $.parseJSON(
                    unescape($(organism_selector + ' option:selected').data('organism'))
                );
                var type = $.parseJSON(
                    unescape($(type_selector + ' option:selected').data('type'))
                );

                // clear out the feature select box
                var $featureselect = $(feature_selector);
                $featureselect.empty();


                // refill the feature select box

                $.each(node.data().features, function(id, feature) {
                    if (feature.organism == organism.id && feature.type == type.name) {
                        var $option = $('<option />').text(feature.name + " - " + feature.uniquename)
                            .attr('data-feature', escape(JSON.stringify(feature)));
                        $featureselect.append($option);
                    }
                });
            };

            $(document).on('change', organism_selector, changeFn);
            $(document).on('change', type_selector, changeFn);
        });


        return node;
    }
};

以下是与此组合框关联的html部分:

<div id="<%= uuid %>" class="center-block">
  <div>
      <label for="select-type">Type</label>
      <input type="text" name="select-type" class="select-type form-control" id="type">
      <span>▼</span>
      <div class="dropdownlist">
      <% _.each(types, function(type, id) { %>
         <option data-type="<%= escape(JSON.stringify(type)) %>"><%= type.name %></option> 
      <% }); %>
      </div>

我的问题是如何选择带有jquery选择器的输入框,以便它返回与之关联的正确标签?

1 个答案:

答案 0 :(得分:0)

我没有在您的代码中看到您尝试访问parentNode的位置。无论哪种方式,jQuery都会返回jQuery对象。您需要使用jQuery的parent()函数

$(selector).parent();

或抓住实际节点然后调用parentNode

$(selector).get(0).parentNode