2017-01-21 5 views
1

私は最初の拡張機能をコード化しようとしています!投稿ボタンでトリガーされたフォームのフィールドのデータを取得し、PHPスクリプトに渡します

コメントを保存したいパブリックフォーラム(オンライン新聞)で書いて、フォームのフィールドをPHPデータベースに保存してSQLデータベースに保存します。私はいくつかの経験があるので、PHP/SQLの部分はOKですが、私はウェブサイトから情報を得るのに苦労しています。拡張子は、フィールド(テキスト/テキストエリア/プレースホルダ)の情報を取得するためにウェブサイトの送信ボタンに反応し、theupload.phpを開き、そこでデータを渡す必要があります。ここで

私がこれまで持っているものです。 manifest.jsonを:

{ 

    "manifest_version": 2, 
    "name": "Borderify", 
    "version": "1.0", 

    "description": "Comment Save", 

    "browser_action": { 
    "default_icon": "icons/icon-19.png", 
    "default_popup": "popup.html" 
    }, 

    "icons": { 
    "48": "icons/icon-48.png", 
    "96": "icons/icon-96.png" 
    }, 

    "content_scripts": [ 
    { 
     "matches": ["*://*.fringo.net/*"], 
     "js": ["comments.js"] 
    } 
    ] 

} 

comments.js(コンテンツファイル):

var elem = document.getElementById("los"); 
elem.addEventListener ('click', Warnung); 

    function Warnung() { 

    var Name = document.getElementById("Name").value; // nach Name suchen 
    var Headline = document.getElementById("Headline").value; 
    var Text = document.getElementById("Text").value; 
    var Kategorie = document.getElementById("Kategorie").value; 

    alert (Name + " | " + Headline + " | " + Text + " | " + Kategorie); 

} 

私は、このHTMLのために働いてしまいました/ JavaScriptサイト私は情報を取得し、デバッグのための警告を開きます。しかし、コメントを送るためのAJAX環境を持つdiepresse.comなどでは機能しません。その理由は?あなたは私がフィールドの値を取得するためにそこにサブミットボタンに反応して拡張を得ることができるヒントを私に与えることができますか?また、どのように私のウェブサイトにそれらを渡すのですか?ネットワークトラフィック(DevToolsなど)をログに記録する必要があるのですか、コンテンツスクリプトを使用するか、バックグラウンドスクリプトが必要ですか?

答えて

1

代わりにclickイベントリスナーの提出イベントリスナーを追加してみてください:

document.addEventListener("submit",function(){ 
console.log(document.getElementById("comment-field").value) 
}); 

そして、あなたは、Ajaxを通して、あなたのウェブサイトにそれを渡すことができます。そのためにWebリクエストAPIは必要ありません。これはあなたが言ったようなWeb要求を処理するためのものですが、あなたの場合には必要ではありません。 クロスソースのajaxリクエストの許可を指定する必要があります:https://developer.chrome.com/extensions/xhr

+0

thx acesmndr、私はもう一度試してみてください。)thx jana – bimbam

関連する問題