Question

我有以下代码：

    <tr>
    <td class="moduleSupport">
        1                               
    </td>
    <td class="moduleName">
        Cargo Hold                              
    </td>
    <td class="currentModuleQuantity">
        <input class="currentModuleQuantity" placeholder="Enter current 

    quantity" type="text">

        <span class="currentModuleQuantityErr"></span>
    </td>
</tr>


<tr>
    <td class="moduleSupport">
        1                               
    </td>
    <td class="moduleName">
        Crow Nest                               
    </td>
    <td class="currentModuleQuantity">
        <input class="currentModuleQuantity" placeholder="Enter current quantity" type="text">
        <span class="currentModuleQuantityErr"></span>
    </td>
</tr>


<tr>
    <td class="moduleSupport">
        1                               
    </td>
    <td class="moduleName">
        Galley                              
    </td>
    <td class="currentModuleQuantity">
        <input class="currentModuleQuantity" placeholder="Enter current quantity" type="text">
        <span class="currentModuleQuantityErr"></span>
    </td>
</tr>


<tr>
    <td class="moduleSupport">
        1                               
    </td>
    <td class="moduleName">
        Information Console                             
    </td>
    <td class="currentModuleQuantity">
        <input class="currentModuleQuantity" placeholder="Enter current quantity" type="text">
        <span class="currentModuleQuantityErr"></span>
    </td>
</tr>

当我点击currentModuleQuantity文本框时，我想获取moduleSupport类的值，因为我想检查用户输入的值是否不大于moduleSupport的值，以及任何给定行中的数量是否为不是标准在我正在处理的当前行下面显示错误。

这是我当前的jquery代码，我正在努力让它写。非常感谢帮助：

var calculateShipUpgradeCost = {

    init: function(config){

        this.config = config;

        this.bindEvents();

    },

    bindEvents: function(){

        this.config.currentModuleQuantity.on('click', this.checkCurrentModuleQuantity);
        this.config.currentQuaterQuantity.on('click', this.checkCurrentQuaterQuantity);

    },

    //Checking if module quantities are good
    checkCurrentModuleQuantity: function(){

      var self = calculateShipUpgradeCost;
      console.log('Click event detected in ship modules section');
      // var row = self.config.currentModuleQuantity.parents('tr');
      // var currentModuleQuantity = $('td', row).eq(0).html();
      // console.log(row);
      console.log(self.config.moduleSupport.text());
      // console.log(self.config.upgradeModQantity.text());
      console.log(self.config.currentModuleQuantity.val());

      // self.config.moduleSupport.each(function(){
        // var supports = self.config.moduleSupport.text(supports);
      // });


    },

    //Check if quarter quantities are all good
    checkCurrentQuaterQuantity: function(){

        var self = calculateShipUpgradeCost;
        console.log('Click event detected in the ship crew quarters section');

    }

}
//Initiate the object
calculateShipUpgradeCost.init({
    currentModuleQuantity: $('input.currentModuleQuantity'),
    currentModuleQuantityErr: $('span.currentModuleQuantityErr'),
    currentQuaterQuantity: $('input.currentQuaterQuantity'),
    currentQuaterQuantityErr: $('span.currentQuaterQuantityErr'),
    currentModules: $('table'),
    moduleSupport: $('td.moduleSupport'),
    upgradeModQantity: $('td.upgradeModQantity')
});

Answer 1

所以，你的问题是你每次都在访问配置对象而不是事件触发器。我对您的代码进行了一些更改，以便访问当前模块支持值。阅读每行上面的评论，以了解我在做什么：

    // ...
    bindEvents: function() {
        // let's create an alias of the object in order to 
        // use it inside jQuery callback without loosing the scope
        var self = this;
        // your way to call those functions was kind of weird, better this way
        this.config.currentModuleQuantity.on('click', function (e) {
            // lets store the trigger and pass it to the functions
            var $trigger = $(this); 
            self.checkCurrentModuleQuantity($trigger);
            // self.checkCurrentQuaterQuantity();
        });
    },
    checkCurrentModuleQuantity: function($trigger) {
        console.log('Click event detected in ship modules section');
        // your big problem. you were trying to access an element from 
        // the config object instead of the trigger. in your config object, 
        // moduleSupport selector was selecting more than one element. also, 
        // no need to alias the object here because we are not digging deeper in 
        // any jQuery callback
        var module_support = $trigger.parents('tr').find('.moduleSupport').text();
        // output the text content of the current moduleSupport td by accessing the parent tr first and then finding the td.moduleSupport
        console.log('Current module support value:', module_support);
    },
    // ...

我真的不知道这是否能回答你的整个问题。但我认为足以让你自己从这里走得更远。如果您有任何其他问题，我很乐意提供帮助。

从jquery中的相同类元素的数组中获取值

1 个答案: