Question

嗨2我正在使用jQuery。在方法中追加行，当我第一次点击添加行按钮时它会附加行但是当第二次和下次时它什么都不做。我需要知道为什么我的.on方法不起作用这是我的代码

<div class="form">
<?php
$form = $this->beginWidget('CActiveForm', array(
    'id' => 'productoption-form',
    'enableAjaxValidation' => false,
));
?>
<p class="note">Fields with <span class="required">*</span> are required.</p>
<?php echo $form->errorSummary($model); ?>

<div class="row">
    <?php echo $form->labelEx($model, 'title'); ?>
    <?php echo $form->textField($model, 'title', array('size' => 60, 'maxlength' => 255)); ?>
    <?php echo $form->error($model, 'title'); ?>
</div>
<div class="row">
    <strong><h3>Add Product Options</h3></strong>
</div>
<div class="row">
    <div class="span-6 headrowname"><strong>Name</strong></div>
    <div class="span-4 headrowprice"><strong>Price</strong></div>
    <div class="span-2"></div>
</div>
<div class="appendrow">
    <div class="row ">
        <div class="span-6">
            <input style="width:100%!important;" type="text" name="option_name" placeholder="Name" required />
        </div>
        <div class="span-4 ">
            <input id="pricetext" type="text" name="option_price" placeholder="Price" required />
        </div>
        <div class="span-2"><input type="button" class="btn btn-primary addrowbtn" value="Add Row" name="addrow" /> </div>
    </div>
</div>
<div class="row buttons">
    <?php echo CHtml::submitButton($model->isNewRecord ? 'Create' : 'Save'); ?>
</div>
<?php $this->endWidget(); ?>

<script>

        $('.addrowbtn').on('click','', function() {
            $('.appendrow').append('<div class="row">\n\
            <div class="span-6">\n\
            <input style="width:100%!important;" type="text" name="option_name" placeholder="Name" required />\n\
            </div><div class="span-4 ">\n\
            <input id="pricetext" type="text" name="option_price" placeholder="Price" required />\n\
            </div><div class="span-2">\n\
            <input type="button" class="btn btn-primary addrowbtn" value="Add Row" name="addrow" />\n\
            </div>\n\
            </div>');
        });

</script>

Answer 1

Jquery仅将$(document).ready(function () { $('.pop-form').popover({ html: true, title: function () { return $("#pop-head").html(); }, content: function () { var result = ''; $.ajax({ url: "your url", async: false, success:function(response){ result = response; } }); return result; } }); // make popup larger var p = $('.popbutton').popover(); p.on("show.bs.popover", function (e) { p.data()["bs.popover"].$tip.css("max-width", "630px"); }); });事件附加到onclick的第一个实例，但不添加到新添加的事件，因为它们是动态生成的，因此它最终会生成多个无效的“添加行”按钮

虽然您可以动态地将.addrowbtn事件重新附加到这些新按钮，但我相信处理此问题的更好方法是在onclick div之外添加单个“添加行”按钮，此处是使用你的代码的小提琴：

http://jsfiddle.net/unez9Lrf/

关于方法问题的jQuery

1 个答案: