Question

我试图调用一个字段的javascript函数onblur。

我面临的两个问题是

1）在页面加载时，弹出窗口（即函数调用中）会自动调用。

2）当我尝试访问函数onblur时，我在控制台中得到了未被捕获的引用错误。

以下是我正在使用的代码：

HTML：

<div class="contact section s4">
            <div class="container">
                <h4>Think and Ink</h4>
                <p class="contact-head">Note: No identity of ur's will be stored or revealed to anybody. feel safe and keep posting what's there in ur heart</p>
                <div class="row contact-form">
                    <form>
                        <div class="col-md-6 text-box">
                            <input data-ng-model="toName" type="text" placeholder="To: Full Name" onblur="myFunction()"/>
                            <input required data-ng-model="song" type="text" placeholder="Any song dedication for this person.?" />
                            <input required data-ng-model="liking" type="text" placeholder="What you like about him/her.?" />
                        <!--    <input type="text" placeholder="Subject" /> -->
                        </div>
                        <div class="col-md-6 textarea">
                            <textarea required data-ng-model="msg" placeholder="Message"></textarea>
                        </div>
                        <div class="clearfix"> </div><br />
                        <input class="btn btn-primary btn-red-lg" data-ng-click="submit()" value="Submit"/>
                    </form>
                </div>


                <!----start-copy-right---->

                <!----//End-copy-right---->
            </div>
        </div>
        <div class="dialogBackdrop" ng-show='customError'>
        <div class="dialog">
            <div>
                <div class="dialogHead">Sorry</div>
                <div class="dialogContent">{{customErrorDialogContent}}</div>
            </div>
            <div class='dialogBtnHolder'>
                <div class="dialogBtn" ng-click='errorDialogCancel()'> OK</div>
            </div>
        </div>
</div>

JavaScript：

var app = angular.module("MyApp", []);




app.controller("MyAppController",function ($scope,$rootScope,$http,$window)
        {
        alert ("form");


        $scope.myFunction = function (){
            if ($scope.toName==null)
                {
                var nullError = "Name cannot be Null.Please Retry..";
                 $scope.customErrorDialogContent= nullError;
                 $scope.customError= true;
                }


        };

        $scope.errorDialogCancel = function(){
            $scope.customError = false;
        };

  $scope.submit = function () {
                alert("clicked");

                if ($scope.toName==null || $scope.toName=="")
                    {
                    console.log("empty");
                    }
                $window.location.href='http://10.17.60.197:8080/spring_test/home.html';
                 $http.post('rest/postmessage',{toName:$scope.toName, song:$scope.song, liking: $scope.liking, msg: $scope.msg})
                 .success(function(data)
                     {
                     $scope.optyCmtDtls = data;



                     }).error(function(data){});

           };




        });

**不是完整的代码（但解释了问题）

任何人都可以帮助我。 ??

Answer 1

使用ng-blur而非onblur：https://docs.angularjs.org/api/ng/directive/ngBlur

如果您使用onblur，则您的功能必须是全局的，而不是在您的范围内定义。

Answer 2

这里我刚用ng-blur删除了onblur ..现在它可以正常工作

<input data-ng-model="toName" type="text" placeholder="To: Full Name" ng-blur="myFunction()"/>

函数onblur没有被调用

2 个答案: