Question

我有非常简单的Jquery代码，它从不显示第二个警报。有人知道出了什么问题吗？

       <script type="text/javascript">
            $(document).ready(function () {
                alert("1");
                $(".images_clicable input").change(function(){
                      alert("2");
                }); 
            });
            $(".images_clicable input").change(function(){
                 alert("2");
            }); 
        </script>
        <div> 
            <div class="images_clicable addPhoto">                    
                <label for="label_image1">
                    <img class="img_preview" id="image1" src="./img/plus.png" height="100px">
                </label>
                <input name="image1" id="label_image1"  type="file">                    
            </div>
         </div>

此代码位于角度视图内。

Answer 1

您遇到问题的原因是您不是以AngularJS方式做事，但是您在jQuery中执行这些操作办法。您可能需要使用directives来完成您在Angular中尝试完成的任务。在一个指令中，你可以访问jQuery的jqLite接口，它将包含你想用jQuery做的任何事情的90％。

这是一个示例指令：

app.directive('alertOnChange', function() {
  return function(scope, element, attrs) {
    element.on('change', function() {
      alert("It works!");
    });
  };
});

以下是修改后的<input>代码：

<input alert-on-change name="image1" id="label_image1"  type="file">

Here是一名掠夺者。

Answer 2

这段代码对我有用，而且我不熟悉角度以角度方式重写。

  function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();
        //check the name of input

        var input_name = $(input).attr('name');
        reader.onload = function (e) {
            $('#'+input_name).attr('src', e.target.result);
            $('#label_'+input_name).attr('value', e.target.result);
        }
        reader.readAsDataURL(input.files[0]);
    }
}

    $(".images_clicable input").change(function(){
        readURL(this);
    });

从未调用过JQuery更改函数

2 个答案: