javascript - 无法将事件绑定(bind)到 jquery.steps 向导中的输入

Question

我正在使用来自 http://www.jquery-steps.com/ 的向导.向导的一切工作都非常顺利，但是当我尝试将事件绑定(bind)到该向导中的输入字段时，它不起作用。以下是该问题的基本代码:

<div class="content">
            <h1>Basic Demo</h1>


            <div id="wizard">
                <h2>First Step</h2>
                <section>
                    <input type="text" class="namer" />

                    <div class="text">This should be replaced</div>

                <h2>Second Step</h2>
                <section>
                    <pdfsgdf</p>
                </section>

            </div>
        </div>

<script>
$(".namer").change(function(e){
  $(".text").html($(this).val()); 
});

$(function ()
                {
                    $("#wizard").steps({
                        headerTag: "h2",
                        bodyTag: "section",
                        transitionEffect: "slideLeft"
                    });
                });

</script>

JSFiddle 位于 http://jsfiddle.net/m23px/

Answer 1

加载向导时，它似乎正在更改事件监听器。您需要改为在 #wizard 上监听事件。

试试这个:

$("#wizard").on('change','.namer',function(){
    $(".text").html($(this).val());     
});

注意:如果您希望更改在用户输入时发生，而不是在字段失去焦点之后，您可以改用 keyup 事件。

$("#wizard").on('keyup','.namer',function(){
    $(".text").html($(this).val());     
});