Javascript 读取当前选项卡的所有图像并显示到IFrame中，并在Chrome扩展中将框架附加到当前页面
读取当前选项卡的所有图像并绑定到另一个页面，将另一个页面加载到IFrame，并在Chrome扩展中将IFrame显示到当前页面 所有代码工作正常，但newTab.html中的newTab.js文件未加载 我想要这样的输出 manifest.jsonJavascript 读取当前选项卡的所有图像并显示到IFrame中，并在Chrome扩展中将框架附加到当前页面,javascript,jquery,html,iframe,google-chrome-extension,Javascript,Jquery,Html,Iframe,Google Chrome Extension,读取当前选项卡的所有图像并绑定到另一个页面，将另一个页面加载到IFrame，并在Chrome扩展中将IFrame显示到当前页面 所有代码工作正常，但newTab.html中的newTab.js文件未加载 我想要这样的输出 manifest.json { "name": "Demo", "version": "0.0.1", "manifest_version": 2, "description": "practice", //"icons": { // "16": "
{
"name": "Demo",
"version": "0.0.1",
"manifest_version": 2,
"description": "practice",
//"icons": {
// "16": "icons/icon16.png",
// "48": "icons/icon48.png",
// "128": "icons/icon128.png"
//},
//"default_locale": "en",
"background": {
"scripts": [
"background.js"
],
"persistent": true
},
"browser_action": {
"default_icon": "icon.png",
"default_title": "browser action demo"
},
"permissions": ["tabs","https://*/*", "http://*/*", "<all_urls>","activeTab","cookies","bookmarks","file://*/*","http://myapp.com/*","https://myapp.com/*"],
"content_scripts": [
{
"matches": [
"https://*/*",
"http://*/*",
"http://myapp.com/*",
"https://myapp.com/*"
],
"css":["bootstrap.css","myscript.css"],
"js": ["content.js"],
"run_at": "document_end",
"all_frames": true
}
],
"web_accessible_resources": ["newTab.html"]
}
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
switch (request.message) {
case "getImages":
var images = [];
var title = [];
var pagetitle = document.title;
var currentdocimg = document.images;
for (var i = 0; i < currentdocimg.length; i++) {
images.push(currentdocimg[i].src);
title.push(currentdocimg[i].alt);
}
var data = { Images: images, Title: title, PageTitle: pagetitle }
sendResponse({ html: data });
break;
case "openModal":
var iFrame = document.createElement("iframe");
iFrame.src = chrome.extension.getURL("newTab.html");
iFrame.style = "display: block !important; width: 80% !important; height: 90% !important; top: 5% !important; right: 0px !important; overflow: hidden !important; position: fixed !important; border: 0px !important; background-color: transparent !important; z-index: 8675339 !important; left: 10% !important;";
document.body.insertBefore(iFrame, document.body.firstChild);
var data = { success: "success" }
sendResponse({ html: data });
break;
case "closeModal":
$('#myModal').modal("hide");
break;
}
});
chrome.runtime.onMessage.addListener（函数（请求、发送方、发送响应）{
开关（请求消息）{
案例“getImages”：
var图像=[]；
var title=[]；
var pagetitle=document.title；
var currentdocimg=document.images；
对于（变量i=0；i<!DOCTYPE html>
<html>
<head>
<style>
.navbar {
border-radius: 0px !important;
}
.savebtn {
display: inline-block;
position: absolute;
margin-top: 15px;
margin-left: 15px;
}
.saveimagediv {
margin-top: 5px;
margin-bottom: 5px;
}
.saveimg {
display: inline-block;
}
.displaynone {
display: none;
}
body {
background: #fff;
margin: 0;
padding: 0;
-webkit-font-smoothing: antialiased;
width: auto;
height: auto;
}
* {
-webkit-box-sizing: border-box;
}
.GRID_1492146176379_hd {
background: rgba(255,255,255,1) url(icon.png) 20px 50% no-repeat;
color: #333;
height: 65px;
line-height: 65px;
font-size: 24px;
font-weight: bold;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 100;
text-align: left;
text-indent: 65px;
}
.GRID_1492146176379_hd .GRID_1492146176379_x {
z-index: 10;
opacity: .5;
position: absolute;
right: 25px;
top: 0;
cursor: pointer;
height: 65px;
width: 25px;
background: transparent url(cross.png) 50% 50% no-repeat;
}
.GRID_1492146176379_hd .GRID_1492146176379_x:hover {
opacity: 1;
}
.GRID_1492146176379_grid {
display: block;
margin: 72px 0 0 58px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb {
border-radius: 8px;
margin: 0 0 0 -10px;
display: block;
background: #fff;
vertical-align: top;
overflow: hidden;
cursor: pointer;
position: relative;
border: 3px solid #fff;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb img {
border: 1px solid #fff;
border-radius: 8px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb img:hover {
border-color: red !important;
}
.imageselected {
border-color: red !important;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_mask {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_saveButton {
position: absolute;
top: 10px;
left: 10px;
width: auto;
border-radius: 4px;
background: #bd081c url(pin.png) 10px 9px no-repeat;
background-size: 15px 20px;
padding: 0 15px 0 0;
text-indent: 26px;
color: #fff;
font-size: 14px;
line-height: 36px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-style: normal;
font-weight: bold;
text-align: left;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
opacity: 0;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_searchButton {
position: absolute;
top: 10px;
right: 10px;
height: 36px;
width: 36px;
border-radius: 4px;
background: rgba(0,0,0,.4) url(pin.png) 50% 50% no-repeat;
background-size: 20px 20px;
opacity: 0;
z-index: 100;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb:hover .GRID_1492146176379_saveButton, .GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb:hover .GRID_1492146176379_searchButton, .GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb:hover .GRID_1492146176379_ft .GRID_1492146176379_dimensions {
opacity: 1;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_imageless .GRID_1492146176379_site, .GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_imageless .GRID_1492146176379_text {
position: absolute;
color: #fff;
left: 15px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_imageless .GRID_1492146176379_site {
top: 20px;
left: 20px;
font-size: 11px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_imageless .GRID_1492146176379_text {
font-size: 19px;
top: 38px;
line-height: 28px;
padding-right: 22px;
font-weight: bold;
letter-spacing: -1px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_ft {
display: block;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_ft span {
position: relative;
display: block;
padding: 10px;
color: #333;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_ft .GRID_1492146176379_dimensions {
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
padding: 0;
position: absolute;
top: -24px;
height: 24px;
line-height: 24px;
left: 0;
text-align: center;
width: 100%;
background: rgba(0,0,0,.2);
color: #fff;
font-size: 10px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
opacity: 0;
}
@media only screen and (min-width: 768px) {
.mymodal-dialog
{
width:80% !important;
}
}
</style>
<link href="bootstrap.css" rel="stylesheet" />
<script src="jquery.min.js"></script>
<script src="bootstrap.min.js"></script>
<script src="newTab.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">Stackview</a>
</div>
<ul class="nav navbar-nav pull-right">
<li><a href="#" id="popupclose">X</a></li>
<!--<button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button>-->
</ul>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-xs-12">
<h3>Select images to add</h3>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-lg-8 col-md-8 col-sm-12">
<div id='message' style="height: 500px;overflow-y: scroll;"></div>
</div>
<div class="col-xs-12 col-lg-4 col-md-4 col-sm-12">
<form>
<div class="form-group">
<label for="Title">Title:</label>
<input type="text" placeholder="Title" class="form-control" id="Title" required>
</div>
<div class="form-group">
<label for="Tags">Tags:</label>
<input type="text" placeholder="Tags" class="form-control" id="Tags">
</div>
<div class="form-group">
<label for="Price" required>Tags:</label>
<input type="text" placeholder="Price" class="form-control" id="Price" required>
</div>
<button type="button" id="btnAdd" class="btn btn-primary">Add</button>
</form>
</div>
</div>
</div>
</body>
</html>
navbar先生{
边界半径：0px！重要；
}
.savebtn{
显示：内联块；
位置：绝对位置；
边缘顶部：15px；
左边距：15px；
}
.saveimagediv{
边缘顶部：5px；
边缘底部：5px；
}
.saveimg{
显示：内联块；
}
.displaynone{
显示：无；
}
身体{
背景：#fff；
保证金：0；
填充：0；
-webkit字体平滑：抗锯齿；
宽度：自动；
高度：自动；
}
* {
-webkit框大小：边框框；
}
.GRID_1492146176379_hd{
背景：rgba（255255255,1）url（icon.png）20px 50%无重复；
颜色：#333；
高度：65px；
线高：65px；
字体大小：24px；
字体大小：粗体；
位置：固定；
排名：0；
左：0；
右：0；
z指数：100；
文本对齐：左对齐；
文本缩进：65px；
}
.GRID_149216146176379_hd.GRID_149216146176379_x{
z指数：10；
不透明度：.5；
位置：绝对位置；
右：25px；
排名：0；
光标：指针；
高度：65px；
宽度：25px；
背景：透明url（cross.png）50%50%无重复；
}
.GRID_149216146176379_hd.GRID_149216146176379_x:悬停{
不透明度：1；
}
.GRID_1492146176379_GRID{
显示：块；
利润率：72px058px；
}
.GRID_149216146176379_GRID.GRID_149216146176379_col.GRID_149216146176379_thumb{
边界半径：8px；
边际：0-10px；
显示：块；
背景：#fff；
垂直对齐：顶部；
溢出：隐藏；
光标：指针；
位置：相对位置；
边框：3px实心#fff；
}
.GRID_149216146176379_GRID.GRID_149216146176379_col.GRID_149216146176379_thumb img{
边框：1px实心#fff；
边界半径：8px；
}
.GRID_149216146176379_GRID.GRID_149216146176379_col.GRID_149216146176379_thumb img:悬停{
边框颜色：红色！重要；
}
.所选图像{
边框颜色：红色！重要；
}
.GRID_149216146176379_GRID.GRID_149216146176379_col.GRID_149216146176379_thumb.GRID_149216146176379_掩码{
位置：绝对位置；
排名：0；
左：0；
底部：0；
右：0；
}
.GRID_149216146176379_GRID.GRID_149216146176379_col.GRID_149216146176379_thumb.GRID_149216146176379_save按钮{
位置：绝对位置；
顶部：10px；
左：10px；
宽度：自动；
边界半径：4px；
背景：#BD081CURL（pin.png）10px 9px无重复；
背景尺寸：15px 20px；
填充：0 15px 0 0；
文本缩进：26px；
颜色：#fff；
字体大小：14px；
线高：36px；
字体系列：“Helvetica Neue”，Helvetica，Arial，无衬线；
字体风格：普通；
字体大小：粗体；
文本对齐：左对齐；
-webkit字体平滑：抗锯齿；
-moz osx字体平滑：灰度；
不透明度：0；
}
.GRID_149216146176379_GRID.GRID_149216146176379_col.GRID_149216146176379_thumb.GRID_149216146176379_search按钮{
位置：绝对位置；
顶部：10px；
右：10px；
高度：36px；
宽度：36px；
边界半径：4px；
背景：rgba（0,0,0,4）url（pin.png）50%50%无重复；
背景尺寸：20px 20px；
不透明度：0；
z指数：100；
}
G
<!DOCTYPE html>
<html>
<head>
<style>
.navbar {
border-radius: 0px !important;
}
.savebtn {
display: inline-block;
position: absolute;
margin-top: 15px;
margin-left: 15px;
}
.saveimagediv {
margin-top: 5px;
margin-bottom: 5px;
}
.saveimg {
display: inline-block;
}
.displaynone {
display: none;
}
body {
background: #fff;
margin: 0;
padding: 0;
-webkit-font-smoothing: antialiased;
width: auto;
height: auto;
}
* {
-webkit-box-sizing: border-box;
}
.GRID_1492146176379_hd {
background: rgba(255,255,255,1) url(icon.png) 20px 50% no-repeat;
color: #333;
height: 65px;
line-height: 65px;
font-size: 24px;
font-weight: bold;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 100;
text-align: left;
text-indent: 65px;
}
.GRID_1492146176379_hd .GRID_1492146176379_x {
z-index: 10;
opacity: .5;
position: absolute;
right: 25px;
top: 0;
cursor: pointer;
height: 65px;
width: 25px;
background: transparent url(cross.png) 50% 50% no-repeat;
}
.GRID_1492146176379_hd .GRID_1492146176379_x:hover {
opacity: 1;
}
.GRID_1492146176379_grid {
display: block;
margin: 72px 0 0 58px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb {
border-radius: 8px;
margin: 0 0 0 -10px;
display: block;
background: #fff;
vertical-align: top;
overflow: hidden;
cursor: pointer;
position: relative;
border: 3px solid #fff;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb img {
border: 1px solid #fff;
border-radius: 8px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb img:hover {
border-color: red !important;
}
.imageselected {
border-color: red !important;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_mask {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_saveButton {
position: absolute;
top: 10px;
left: 10px;
width: auto;
border-radius: 4px;
background: #bd081c url(pin.png) 10px 9px no-repeat;
background-size: 15px 20px;
padding: 0 15px 0 0;
text-indent: 26px;
color: #fff;
font-size: 14px;
line-height: 36px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
font-style: normal;
font-weight: bold;
text-align: left;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
opacity: 0;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_searchButton {
position: absolute;
top: 10px;
right: 10px;
height: 36px;
width: 36px;
border-radius: 4px;
background: rgba(0,0,0,.4) url(pin.png) 50% 50% no-repeat;
background-size: 20px 20px;
opacity: 0;
z-index: 100;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb:hover .GRID_1492146176379_saveButton, .GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb:hover .GRID_1492146176379_searchButton, .GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb:hover .GRID_1492146176379_ft .GRID_1492146176379_dimensions {
opacity: 1;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_imageless .GRID_1492146176379_site, .GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_imageless .GRID_1492146176379_text {
position: absolute;
color: #fff;
left: 15px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_imageless .GRID_1492146176379_site {
top: 20px;
left: 20px;
font-size: 11px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_imageless .GRID_1492146176379_text {
font-size: 19px;
top: 38px;
line-height: 28px;
padding-right: 22px;
font-weight: bold;
letter-spacing: -1px;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_ft {
display: block;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_ft span {
position: relative;
display: block;
padding: 10px;
color: #333;
}
.GRID_1492146176379_grid .GRID_1492146176379_col .GRID_1492146176379_thumb .GRID_1492146176379_ft .GRID_1492146176379_dimensions {
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
padding: 0;
position: absolute;
top: -24px;
height: 24px;
line-height: 24px;
left: 0;
text-align: center;
width: 100%;
background: rgba(0,0,0,.2);
color: #fff;
font-size: 10px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
opacity: 0;
}
@media only screen and (min-width: 768px) {
.mymodal-dialog
{
width:80% !important;
}
}
</style>
<link href="bootstrap.css" rel="stylesheet" />
<script src="jquery.min.js"></script>
<script src="bootstrap.min.js"></script>
<script src="newTab.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<a class="navbar-brand" href="#">Stackview</a>
</div>
<ul class="nav navbar-nav pull-right">
<li><a href="#" id="popupclose">X</a></li>
<!--<button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button>-->
</ul>
</div>
</nav>
<div class="container-fluid">
<div class="row">
<div class="col-xs-12">
<h3>Select images to add</h3>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-lg-8 col-md-8 col-sm-12">
<div id='message' style="height: 500px;overflow-y: scroll;"></div>
</div>
<div class="col-xs-12 col-lg-4 col-md-4 col-sm-12">
<form>
<div class="form-group">
<label for="Title">Title:</label>
<input type="text" placeholder="Title" class="form-control" id="Title" required>
</div>
<div class="form-group">
<label for="Tags">Tags:</label>
<input type="text" placeholder="Tags" class="form-control" id="Tags">
</div>
<div class="form-group">
<label for="Price" required>Tags:</label>
<input type="text" placeholder="Price" class="form-control" id="Price" required>
</div>
<button type="button" id="btnAdd" class="btn btn-primary">Add</button>
</form>
</div>
</div>
</div>
</body>
</html>
chrome.runtime.onMessage.addListener(function (request, sender, sendResponse) {
switch (request.message) {
case "loadNewTab":
var StackUserID = null;
console.log(request.data);
images = request.data.tabHtml.Images;
title = request.data.tabHtml.Title;
pagetitle = request.data.tabHtml.PageTitle;
var style = document.createElement('script');
style.type = 'text/javascript';
style.href = chrome.extension.getURL('bootstrap.css');
(document.head || document.documentElement).appendChild(style);
var style = document.createElement('link');
style.rel = 'stylesheet';
style.type = 'text/css';
style.href = chrome.extension.getURL('bootstrap.css');
(document.head || document.documentElement).appendChild(style);
var text = "";
if (images.length > 0) {
//text += "<span class='GRID_1492146176379_hd'><span class='GRID_1492146176379_hdMsg'>Choose a Pin to save</span><span id='popupclose' class='GRID_1492146176379_x'></span></span>";
text += "<span class='GRID_1492146176379_grid'>";
//text += "<div class='row'>";
for (var i = 0; i < images.length; i++) {
if (images[i] != null && images[i] != undefined && images[i].toString() != "") {
text += "<div class='GRID_1492146176379_col col-md-3 col-lg-3 col-sm-6 col-xs-12'><div class='GRID_1492146176379_thumb'><img class='img img-responsive' alt='" + title[i] + "' src='" + images[i] + "'/></div></div>";
//<input type='button' class='GRID_1492146176379_saveButton savebtn' value='Save'/>
//text += "<div class='GRID_1492147712179_thumb'><input type='button' class='btn btn-danger savebtn displaynone' value='Save' /><img src='" + images[i] + "' class='img-rounded img-responsive saveimg'/></div>";
}
}
//text += "</div>";
text += "</span>";
}
//if (images.length > 0) {
// text += "<div class='row'>";
// for (var i = 0; i < images.length; i++) {
// if (images[i] != null && images[i] != undefined && images[i].toString() != "") {
// text += "<div class='col-md-3 col-lg-3 col-sm-6 col-xs-12'><img class='img-thumbnail img img-responsive' src='" + images[i] + "'/></div>";
// //text += "<div class='GRID_1492147712179_thumb'><input type='button' class='btn btn-danger savebtn displaynone' value='Save' /><img src='" + images[i] + "' class='img-rounded img-responsive saveimg'/></div>";
// }
// }
// text += "</div>";
//}
console.log(text);
var message = document.querySelector('#message');
message.innerHTML = text;
var Close = document.getElementById("popupclose");
var closeFunction = function () {
chrome.tabs.getCurrent(function (tab) {
chrome.tabs.sendMessage(tabs[0].id, { message: "closeModal" }, function (response) {
var html = response.html;
});
});
//chrome.tabs.getCurrent(function (tab) {
// chrome.tabs.remove(tab.id, function () { });
//});
};
Close.addEventListener('click', closeFunction, false);
//document.getElementById('popupclose').addEventListener('click', clickHandler);
var classname = document.getElementsByClassName("GRID_1492146176379_thumb");
var myFunction = function () {
//alert("Clicked")
//var src = this.previousSibling.src;
// var alt = this.alt;
if (pagetitle != null && pagetitle != undefined) {
$(this).toggleClass("imageselected");
$("#Title").val(pagetitle);
// document.getElementById("Title").value = pagetitle;
}
};
for (var i = 0; i < classname.length; i++) {
classname[i].addEventListener('click', myFunction, false);
}
function getCookies(domain, name, callback) {
chrome.cookies.get({ "url": domain, "name": name }, function (cookie) {
if (callback) {
callback(cookie.value);
}
});
}
//usage:
getCookies("http://myapp.com", "stakUserid", function (stakUserid) {
if (stakUserid != null || stakUserid != undefined) {
StackUserID = stakUserid;
// Loadimages();
}
//alert(password);
});
var btnadd = document.getElementById("btnAdd");
var AddFunction = function () {
if (StackUserID != null && StackUserID != undefined) {
var imgsrc = [];
$("#message").find('.imageselected').each(function (index) {
imgsrc[index] = $(this).find("img").attr("src");
});
var title = $("#Title").val().trim();
var tag = $("#Tags").val().trim();
var itemtags = [];
if (tag.includes(",")) {
itemtags = tag.split(",");
}
else {
itemtags = tag;
}
var price = $("#Price").val().trim();
if (imgsrc.length > 0) {
//var res = title + " " + tag + " " + price + " " + imgsrc.length
var postdata = {
"userid": StackUserID,
"images": imgsrc,
"title": title,
"price": price,
"tags": itemtags
}
console.log(JSON.stringify(postdata));
$.ajax({
type: "POST",
url: "http://myapp.com/likedImages",
// The key needs to match your method's input parameter (case-sensitive).
data: JSON.stringify(postdata),
contentType: "application/json;charset=utf-8",
dataType: "json",
success: function (data) {
alert(data.message);
},
failure: function (errMsg) {
alert(errMsg);
}
});
}
} else {
}
};
btnadd.addEventListener('click', AddFunction, false);
break;
}
});
//function clickHandler(e) {
// chrome.runtime.sendMessage({ directive: "popup-click" }, function (response) {
// this.close(); // close the popup when the background finishes processing request
// });
//}