Question

我在使用yii2项目中的引导模式中使用javascript文件时遇到问题。我有一个模态框，其中的视图用于通过ajax加载模态的主体。在其中一个视图中，我已经注册了一个javascript文件，根据一些条件禁用某些表单输入。我第一次加载模态时，javascript函数没有任何问题。但是，如果我关闭模式并重新打开它，那么在我刷新整个页面之前，javascript就不再有效了。

我已经尝试使用

完全清除模态的内容

$("#modal").on('hide.bs.modal', function(e){
    var contentArea = $(this).find('#modalContent');
    contentArea.html('');
});

但是在重新打开模态时，javascript仍无效。

这是定义模态

的代码

<?php 
  Modal::begin([
    'header'=>'<h4>Event</h4>',
    'id'=>'modal',
    'size'=>'modal-lg',
    'options'=>[
        'tabindex'=>false
    ]
  ]);
?>
  <div id="modalContent"></div>
<?php Modal::end(); ?>

将页面加载到模态中......

<?php
  $this->registerJsFile('@web/js/registration.js');
?>
<div class="registrant-create">
<?php $form = ActiveForm::begin([
   'id'=>$model->formName(),
   'action'=>['create-payment'],
   'enableAjaxValidation'=>true,
   'validationUrl'=>['/event/registrant/validate-registrant','event_id'=>$model->event_id],
   'options'=>['data-pjax'=>true],
]); ?>
<input type="hidden" name="form_page" value="level" id="form_page" />
<div id="page-level">
    <?=$this->render('_form_level', [
        'form' => $form,
        'model' => $model,
        'model_code'=>$model_code,
        'list_levels' => $list_levels,
        'list_members' => $list_members,
    ])?>
</div>
<div id="page-attendee">
    <?=$this->render('_form_attendee', [
        'form' => $form,
        'model' => $model,
        'model_organization' => $model_organization,
        'models_attendee' => $models_attendee,
        'models_personal' => $models_personal,
        'models_personalEmail' => $models_personalEmail,
        'models_email' => $models_email,
        'models_answer' => $models_answer,
    ]);?>
</div>

正在呈现的子视图包含各个表单页面的字段（共4个字段，将其剪切以使其可读）。其中一个子视图的示例是......

<div class="alert alert-info">
    Instructions... 
</div>
<div class="row">
    <?= $form->field($model, 'level_id',['options'=>['class'=>'col-lg-5']])->dropDownList($list_levels['items'],['options'=>$list_levels['attributes']])->label("Select a level"); ?>
    <?= $form->field($model_code, 'code',['options'=>['class'=>'col-lg-5']])->label("Enter a registration code")?>
</div>
<?= $form->field($model, 'member_id','inputOptions'=>['data-disabled'=>true]])->dropDownList($list_members)->label("Select a member"); ?>


<div class="form-group">
    <?= Html::button('Continue', ['class' => 'btn btn-primary btn-block btn-lg form-continue', 'data-next'=>'attendee'])?>
</div>

重新加载javascript文件需要做些什么吗？非常感谢任何帮助。

Answer 1

试试这个：

$(document).on('hide.bs.modal', '#modal' , function(e){
    var contentArea = $(this).find('#modalContent');
    contentArea.html('');
});

关闭/重新打开模式后Javascript无法正常工作

1 个答案: