2016-05-13 52 views
3

對於Chrome擴展,我使用彈出窗口作爲登錄窗體與Angular。爲什麼id Chrome擴展程序彈出關閉輸入自動填充建議點擊?

但在OS X上,當我點擊用戶名自動填充建議時,彈出窗口會關閉,就像當您在彈出窗口外單擊一樣。但它在Windows上運行良好。

<!doctype html> 
<html> 

<head> 
    <meta charset="utf-8"> 
    <!-- build:css styles/vendor.css --> 
    <!-- bower:css --> 

    <link href="bower_components/bootstrap/dist/css/bootstrap.css" rel="stylesheet"> 
    <!-- endbower --> 
    <!-- endbuild --> 
    <!-- build:css styles/main.css --> 
    <link href="styles/main.css" rel="stylesheet"> 
    <!-- endbuild --> 
</head> 

<body ng-app="myApp" ng-controller="MainCtrl"> 

    <div ng-if="loggedIn"> 
    <p> 
     <img src="images/logo-full.png"> 
    </p> 
    <p class=""><strong>You're logged in as:</strong> 
    </p> 
    <p><i>{{user}}</i> 
    </p> 
    <br> 
    <div class="center-block"> 
     <button class="btn btn-danger" ng-click="logout()">Log out</button> 
     <a class="btn btn-primary pull-right" ng-href="https://example.com/cockpit" target="_blank">Go to Cockpit</a> 

    </div> 
    </div> 

    <div ng-if="!loggedIn"> 
    <p> 
     <img src="images/logo-full.png"> 
    </p> 
    <form ng-submit="login(username, password)"> 
     <div class="form-group"> 
     <label for="username" class="sr-only">Email</label> 
     <input id="username" class="form-control" type="text" ng-model="username" required placeholder="Email"> 
     </div> 
     <div class="form-group"> 
     <label for="password" class="sr-only">Password</label> 
     <input id="password" class="form-control" type="password" ng-model="password" required placeholder="Password"> 
     </div> 
     <div class="alert alert-danger" role="alert" ng-if="error">{{error}}</div> 
     <div class="form-group"> 
     <button type="submit" class="btn btn-primary" ng-disabled="loading">Log in</button> 
     </div> 
     <div class="form-group"> 
     <a href="https://example.com/auth/reset" target="_blank"><small>Forgot your password?</small></a> 
     </div> 
    </form> 
    <div class="margin-top-big"> 
     <a href="https://example.com/auth/signup" target="_blank" class="btn btn-block btn-success"><strong>Don't have an account? Get started</strong></a> 
    </div> 
    </div> 

    <!-- build:js scripts/vendor.js --> 
    <!-- bower:js --> 
    <script src="bower_components/jquery/dist/jquery.js"></script> 
    <script src="bower_components/jquery-cookie/jquery.cookie.js"></script> 
    <script src="bower_components/angular/angular.js"></script> 
    <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script> 
    <!-- endbower --> 
    <!-- endbuild --> 
    <script src="lib/myLib.js"></script> 

    <!-- build:js scripts/popup.js --> 
    <script src="scripts/popup.js"></script> 
    <!-- endbuild --> 
</body> 

</html> 

任何想法的解決方法?

+0

嘿,你發現這個問題的解決方案? – Bazinga

+0

@JsIsAwesome還沒有。如果是這種情況,我會通知您 – Jordane

+0

謝謝...... :) – Bazinga

回答

3

看來,OSX處理點擊文本彈出窗口作爲擴展彈出區域之外的點擊,導致它關閉。

我在Safari和Chrome的擴展中已經觀察到它,但僅在OSX上。 這是Chromium bugtracker中的related ticket

在某些情況下,您可以製作一個自定義控件,它將使用div來顯示彈出內容,從而防止此問題。對於自動填充,我不認爲該解決方法存在。您可以嘗試在OSX瀏覽器中完全禁用自動填充功能。幾乎沒有更好的解決方案,但可能適合你。

+0

:-(在過去一年中發現任何工作,也遇到同樣的問題。 –

相關問題