js中图片显示用ajax,如何用Jquery ajax把上传的图片和信息显示到页面中

怼烎@ 2022-09-03 06:18 144阅读 0赞

我现在可以上传一张图片预览到页面上，也可以把文字插入到数据库中

但是我不知道怎么用Jquery Ajax同时把照片和文字同时插入到数据库中

并显示到页面上？

$('\#send').click(function () \{

var message = $('\#publishcontent').val();

var imgsrc = $('.imgcontent').attr('src');

//alert(message);

//alert(imgsrc);

if ((message == null || message =="") && (imgsrc == null || imgsrc=="")) \{

alert("please input message or image!")

else if (message != null && (imgsrc == null || imgsrc == "")) \{

$.ajax(\{

url:"/PublishandFeedback/PublishSave",

type: "POST",

async: true,

data: \{ "message": message, "imgsrc": "" \},

dataType: "json",

success: function (result) \{

if (result != null) \{

//$('.publishContent').append('

'+message+'

');

$('.publishArea').prepend('

![Team%20member.PNG][Team_20member.PNG]

' +

' + result\[0\].CreateBy + '

' +

' + result\[0\].PContent + '

' +

*  ' +

Time' +

Like' +

Comment' +

--------------------

');

\} else \{

alert('Error');

\},

error: function (XMLHttpRequest, textStatus, errorThrown) \{

alert(XMLHttpRequest.status);

alert(XMLHttpRequest.readyState);

alert(textStatus); // paser error;

alert("Error:" + result.toString());

\},

\});

else if ((message == null || message=="") && imgsrc != null)

$.ajax(\{

url: "/PublishandFeedback/PublishSave",

type: "POST",

async: true,

data: \{ "message": message, "imgsrc": imgsrc \},

dataType: "json",

success: function (result) \{

if (result != null) \{

$('.publishArea').prepend('

![Team%20member.PNG][Team_20member.PNG]

' +

' + result\[0\].CreateBy + '

' +

!['%20+%20result%5B0%5D.Imgsrc%20+%20'][Team_20member.PNG]

' +

*  ' +

Time' +

Like' +

Comment' +

--------------------

');

\} else \{

alert('Error');

\},

error: function (XMLHttpRequest, textStatus, errorThrown) \{

alert(XMLHttpRequest.status);

alert(XMLHttpRequest.readyState);

alert(textStatus); // paser error;

alert("Error:" + result.toString());

\},

\});

else if (message != null && imgsrc != null)

$.ajax(\{

url: "/PublishandFeedback/PublishSave",

type: "POST",

async: true,

data: \{ "message": message, "imgsrc": imgsrc \},

dataType: "json",

success: function (result) \{

if (result != null) \{

$('.publishArea').prepend('

![Team%20member.PNG][Team_20member.PNG]

' +

' + result\[0\].CreateBy + '

' +

' + result\[0\].PContent + '

' +

!['%20+%20result%5B0%5D.Imgsrc%20+%20'][Team_20member.PNG]

' +

*  ' +

Time' +

Like' +

Comment' +

--------------------

');

\} else \{

alert('Error');

\},

error: function (XMLHttpRequest, textStatus, errorThrown) \{

alert(XMLHttpRequest.status);

alert(XMLHttpRequest.readyState);

alert(textStatus); // paser error;

alert("Error:" + result.toString());

\},

\});

//load Publish and Feedback

function pafload() \{

$.ajax(\{

url: "/PublishandFeedback/PaFLoad",

type: "POST",

async: true,

data: \{\},

dataType: "json",

success: function (result) \{

if (result != null)

for (var i = 0; i < result.length; i++) \{

$('.publishArea').prepend('

![Team%20member.PNG][Team_20member.PNG]

' +

' + result\[i\].CreateBy + '

' +

' + result\[i\].PContent + '

' +

!['%20+%20result%5Bi%5D.Imgsrc%20+%20'][Team_20member.PNG]

' +

*  ' +

Time' +

Like' +

Comment' +

--------------------

');

\});

[Team_20member.PNG]:

js中图片显示用ajax,如何用Jquery ajax把上传的图片和信息显示到页面中

发表评论取消回复

还没有评论，来说两句吧...

相关阅读

相关 JS 页面显示图片

相关 Ajax上传图片

相关 springmvc_上传图片以及显示图片到页面

相关 js图片上传并显示

相关 AJAX+JQuery+SpringMVC实现图片上传

相关 js中图片显示用ajax,如何用Jquery ajax把上传的图片和信息显示到页面中

相关 nodejs+express+ajax实现图片上传及显示

相关 ajax上传图片

相关 html上传图片后，在页面显示上传的图片

相关 jquery的ajax上传图片并且显示上传进度