我有一個非常簡單的Chrome應用程序。它顯示一個帶有搜索框的彈出窗口。提交搜索框會在新標籤頁中打開我的網站。Chrome App onSubmit

默認情況下，搜索框爲空。當它是空的，點擊提交不應該做任何事情。我的popup.html如下所示：

<html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <title>foo</title> 
    <link rel="stylesheet" type="text/css" href="popup.css" /> 
    </head> 
<body> 
    <div id="srch"> 
    <form target="_blank" action="foo.php" method="get" onsubmit="if (document.getElementById('box').value.length < 1) return false;"> 
     <input type="text" id="box" name="foo" value="" /> 
     <input type="submit" value="foo" /> 
    </form> 
    </div> 
</body> 
</html>

如果我在瀏覽器中打開popup.html，然後單擊提交不執行任何操作。但是，如果我將它作爲Chrome應用程序打開，那麼點擊提交仍然會提交表單，而沒有任何內容。所以似乎JavaScript被忽略了。

來源

2013-01-10 Andrew

問題在你的腳本

Chrome瀏覽器擴展不允許內聯JS或<script>標籤在HTML代碼，所以你的代碼onsubmit="if將不會超過CSP，消除這些後，我讓你的腳本運行。你的代碼

manifest.json的

註冊瀏覽器操作的

樣品示範清單文件。

{ 
    "name": "chrome-app-onsubmit", 
    "description": "http://stackoverflow.com/questions/14263946/chrome-app-onsubmit", 
    "version": "1", 
    "manifest_version": 2, 
    "browser_action": { 
     "default_popup": "popup.html" 
    } 
}

popup.html

淘汰內嵌腳本

<html> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
    <title>foo</title> 
    <script src="popup.js"></script> 
    </head> 
<body> 
    <div id="srch"> 
     <input type="text" id="box" name="foo" value="" /> 
     <input type ="submit" id="submit" value="foo" /> 
    </div> 
</body> 
</html>

popup.js

你的功能放在這裏。

function _clickHandler() { 
    if (document.getElementById('box').value.length < 1) { 
     return false; 
    } else { 
     console.log("In Success Handler.."); 
     //Do Your AJAX Request Call here 
    } 
} 
document.addEventListener("DOMContentLoaded", function() { 
    document.getElementById("submit").onclick = _clickHandler; 
});

檢查How to Load an Extension測試您的腳本。

參考

Content Security Policy

來源

2013-01-10 19:39:11 Sudarshan

完美，謝謝！ – Andrew

試試這個......不同的瀏覽器可以挑剔的javascript格式...只是一個想法

onsubmit="if (document.getElementById('box').value.length < 1) {return false;};">

來源

2013-01-10 17:51:45

沒有不幸的是工作。在Chrome中打開popup.html。但是，當它作爲Chrome擴展打開時無法使用。 – Andrew

Chrome App onSubmit

回答

參考

相關問題