Change()不会对类标识符做出反应

Olg*_*lga 7 html javascript css jquery css3

每当一个字段(所有相同类)的值发生变化时,我需要执行某些操作.它虽然不起作用.

$('.payment-amount').change(function () {
        ajax_get_supposed_money_left();
    });
Run Code Online (Sandbox Code Playgroud)

我不知道为什么.我使用ID而不是类执行完全相同的操作,everytnig工作正常:

$('#tripsummary-money_begin').change(function () {
        ajax_get_supposed_money_left();
    });
Run Code Online (Sandbox Code Playgroud)

正确指定了类,因为在我的函数中我使用$('.payment-amount').val()它并返回正确的值.它只是在与change()行动一起使用时不想工作.

编辑:
我正在使用Yii2,所以相关Html的部分看起来像这样:

DynamicFormWidget::begin([
    'widgetContainer' => 'dynamicform_wrapper_expenses', // required: only alphanumeric characters plus "_" [A-Za-z0-9_]
    'widgetBody' => '.container-expenses', // required: css class selector
    'widgetItem' => '.item-expense', // required: css class
    'limit' => 99, // the maximum times, an element can be cloned (default 999)
    'min' => 0, // 0 or 1 (default 1)
    'insertButton' => '.add-item-expense', // css class
    'deleteButton' => '.remove-item-expense', // css class
    'model' => $expense_models[0],
    'formId' => 'expense-create-form',
    'formFields' => [
        'amount',
        'category',
        'comment',
    ],
]);
?>
<div class="panel-body container-items">
    <div class="panel-heading font-bold">
        <button type="button" class="pull-left add-item-expense btn btn-success btn-xm"><i class="fa fa-plus"></i> <?= Yii::t('app', 'Add') ?></button>
        <div class="clearfix"></div>
    </div>
    <div id="payments-container" class="panel-body container-expenses"><!-- widgetContainer -->
        <?php foreach ($expense_models as $index => $model): ?>
            <div class="item-expense"><!-- widgetBody -->
                <div>
                    <?php
                    // necessary for update action.
                    if (!$model->isNewRecord) {
                        echo Html::activeHiddenInput($model, "[{$index}]id");
                    }
                    ?>
                    <div class="row">
                        <div class="col-md-3">
                            <?=
                            $form->field($model, "[{$index}]amount")->textInput(['class' => 'form-control payment-amount'])->label(Yii::t('app', 'Amount'))
                            ?>
                        </div>
                        <div class="col-md-3">
                            <?=
                            $form->field($model, "[{$index}]trip_summary_category_id")->dropDownList(ArrayHelper::map(TripSummaryCategory::find()->all(), 'id', 'name'), [
                                'class' => 'form-control payment_type',
                            ])->label(Yii::t('app', 'Category'))
                            ?>
                        </div>
                        <div class="col-md-3" >
                            <?=
                            $form->field($model, "[{$index}]comment")->textInput()->label(Yii::t('app', 'Comment'));
                            ?>
                        </div>
                        <button type="button" class="custom-remove-btn remove-item-expense btn btn-danger glyphicon glyphicon-remove"></button>
                    </div><!-- end:row -->
                </div>
                <div class="custom-divider"></div>
            </div>
        <?php endforeach; ?>
    </div>
    <?php DynamicFormWidget::end(); ?>
</div>
Run Code Online (Sandbox Code Playgroud)

在此输入图像描述

Olg*_*lga 2

我终于找到了答案。由于一开始就没有 . payment-amount 类字段,因此代码无法按照我想要的方式执行。为了防止这种情况,我使用:

$('body').on('change', '.payment-amount', function() {
        console.log($(this).val());
        // rest of code
    });
Run Code Online (Sandbox Code Playgroud)