AJax Null Data 当返回到 HTML 时更改为另一个值

huangapple
go评论104阅读模式
英文:

AJax Null Data Change to another valeu when return to html

问题

以下是已经翻译好的代码部分：

  1. $.ajax({
  2.     type: "GET",
  3.     contentType: "application/json",
  4.     url: endpoint + apiKey,
  5.     success: function(response) {
  6.         $.each(response, function(key, value) {
  7.             $('.first-set').append(
  8.                 '<li><a href="' + value.application_base_url + value.application_url + '">' +
  9.                 '<div> ' +
  10.                 '<i class="' + value.application_icon + '"></i> ' +
  11.                 '</div>' +
  12.                 '<span>Search</span>' +
  13.                 '</a></li>'
  14.             );
  15.         })
  16.     },
  17. });
英文:

This is my AJAX code that I want to use to get data from an API to show in a div. When I query the data I get value.application_icon is null so this file is blank

I want to use value.application_image when value.application_icon is null. I don't know how to config this.

<!-- language: lang-js -->

  1. $.ajax({
  2.       type: &quot;GET&quot;,
  3.       contentType: &quot;application/json&quot;,
  4.       url: endpoint + apiKey,
  5.       success: function(response) {
  6.         $.each(response, function(key, value) {
  7.           $(&#39;.first-set&#39;).append(
  8.             &#39;&lt;li&gt;&lt;a href=&quot;&#39; + value.application_base_url + &#39;&#39; + value.application_url + &#39;&quot;&gt; \n &#39; +
  9.             &#39;&lt;div&gt; \n &#39; +
  10.             &#39;&lt;i class=&quot;&#39; + value.application_icon + &#39;&quot;&gt;&lt;/i&gt; \n &#39; +
  11.             &#39;&lt;/div&gt;&#39; +
  12.             &#39;&lt;span&gt;&#39; + &quot;Search&quot; + &#39;&lt;/span&gt;&#39; +
  13.             &#39;&lt;/a&gt;&lt;/li&gt;&#39;
  14.           );
  15.         })
  16.       },

答案1

得分: 2

$.ajax({
type: "GET",
contentType: "application/json",
url: endpoint + apiKey,
success: function(response) {
$.each(response, function(key, value) {
var icon = !value.application_icon ? value.application_image : value.application_icon;
$('.first-set').append(
'

  • ' +
    '

    ' +
    '' +
    '

    ' +
    'Search' +
    '

    • '
    );
    });
    },
    error: function(jqXHR, textStatus, errorThrown) {
    console.log(errorThrown);
    }
    });

    英文: 
    1. $.ajax({    
    2.     type: &quot;GET&quot;,
    3.     contentType: &quot;application/json&quot;,
    4.     url: endpoint + apiKey,
    5.     success: function(response) {
    6.         $.each(response, function(key, value) {
    7.             var icon = !value.application_icon?  value.application_image: value.application_icon;
    8.             $(&#39;.first-set&#39;).append(
    9.                     &#39;&lt;li&gt;&lt;a href=&quot;&#39; + value.application_base_url + value.application_url + &#39;&quot;&gt; \n &#39; +
    10.                     &#39;&lt;div&gt; \n &#39; +
    11.                     &#39;&lt;i class=&quot;&#39; + icon + &#39;&quot;&gt;&lt;/i&gt; \n &#39; +
    12.                     &#39;&lt;/div&gt;&#39;+
    13.                     &#39;&lt;span&gt;Search&lt;/span&gt;&#39; +
    14.                     &#39;&lt;/a&gt;&lt;/li&gt;&#39;
    15.                 );
    16.         });
    17.     },
    18.     error: function(jqXHR, textStatus, errorThrown) {
    19.         console.log(errorThrown);
    20.     }
    21. });

    答案2

    得分: 1

    尝试这段代码片段。

    1. $.ajax({
    2.     type: "GET",
    3.     contentType: "application/json",
    4.     url: endpoint + apiKey,
    5.     success: function(response) {
    6.         $.each(response, function(key, value) {
    7.             var icon = value.application_icon;
    8.             if (!icon) {
    9.                 icon = value.application_image;
    10.             }
    11.             if (icon) {
    12.                 $('.first-set').append(
    13.                     '<li><a href="' + value.application_base_url + value.application_url + '">' +
    14.                     '<div>' +
    15.                     '<i class="' + icon + '"></i>' +
    16.                     '</div>'+
    17.                     '<span>Search</span>' +
    18.                     '</a></li>'
    19.                 );
    20.             }
    21.         });
    22.     },
    23.     error: function(jqXHR, textStatus, errorThrown) {
    24.         console.log(errorThrown);
    25.     }
    26. });

    或者像这样使用for循环。

    1. $.ajax({
    2.     type: "GET",
    3.     contentType: "application/json",
    4.     url: endpoint + apiKey,
    5.     success: function(response) {
    6.         for(var i=0; i<response.length; i++) {
    7.             var value = response[i];
    8.             var icon = value.application_icon;
    9.             if (!icon) {
    10.                 icon = value.application_image;
    11.             }
    12.             if (icon) {
    13.                 $('.first-set').append(
    14.                     '<li><a href="' + value.application_base_url + value.application_url + '">' +
    15.                     '<div>' +
    16.                     '<i class="' + icon + '"></i>' +
    17.                     '</div>'+
    18.                     '<span>Search</span>' +
    19.                     '</a></li>'
    20.                 );
    21.             }
    22.         }
    23.     },
    24.     error: function(jqXHR, textStatus, errorThrown) {
    25.         console.log(errorThrown);
    26.     }
    27. });

    希望这对你有所帮助。

    英文:

    Try this code snippet.

    1. $.ajax({    
    2.     type: &quot;GET&quot;,
    3.     contentType: &quot;application/json&quot;,
    4.     url: endpoint + apiKey,
    5.     success: function(response) {
    6.         $.each(response, function(key, value) {
    7.             var icon = value.application_icon;
    8.             if (!icon) {
    9.                 icon = value.application_image;
    10.             }
    11.             if (icon) {
    12.                 $(&#39;.first-set&#39;).append(
    13.                     &#39;&lt;li&gt;&lt;a href=&quot;&#39; + value.application_base_url + value.application_url + &#39;&quot;&gt; \n &#39; +
    14.                     &#39;&lt;div&gt; \n &#39; +
    15.                     &#39;&lt;i class=&quot;&#39; + icon + &#39;&quot;&gt;&lt;/i&gt; \n &#39; +
    16.                     &#39;&lt;/div&gt;&#39;+
    17.                     &#39;&lt;span&gt;Search&lt;/span&gt;&#39; +
    18.                     &#39;&lt;/a&gt;&lt;/li&gt;&#39;
    19.                 );
    20.             }
    21.         });
    22.     },
    23.     error: function(jqXHR, textStatus, errorThrown) {
    24.         console.log(errorThrown);
    25.     }
    26. });

    Or else use like this with for loop

    1. $.ajax({    
    2.         type: &quot;GET&quot;,
    3.         contentType: &quot;application/json&quot;,
    4.         url: endpoint + apiKey,
    5.         success: function(response) {
    6.             for(var i=0; i&lt;response.length; i++) {
    7.                 var value = response[i];
    8.                 var icon = value.application_icon;
    9.                 if (!icon) {
    10.                     icon = value.application_image;
    11.                 }
    12.                 if (icon) {
    13.                     $(&#39;.first-set&#39;).append(
    14.                         &#39;&lt;li&gt;&lt;a href=&quot;&#39; + value.application_base_url + value.application_url + &#39;&quot;&gt; \n &#39; +
    15.                         &#39;&lt;div&gt; \n &#39; +
    16.                         &#39;&lt;i class=&quot;&#39; + icon + &#39;&quot;&gt;&lt;/i&gt; \n &#39; +
    17.                         &#39;&lt;/div&gt;&#39;+
    18.                         &#39;&lt;span&gt;Search&lt;/span&gt;&#39; +
    19.                         &#39;&lt;/a&gt;&lt;/li&gt;&#39;
    20.                     );
    21.                 }
    22.             });
    23.         },
    24.         error: function(jqXHR, textStatus, errorThrown) {
    25.             console.log(errorThrown);
    26.         }
    27.     });

    hope it will help you.

    huangapple
    • 本文由 发表于 2023年3月31日 17:51:42
    • 转载请务必保留本文链接：https://go.coder-hub.com/75897112.html
    • ajax
    • javascript
    • jquery
    匿名

    发表评论

    匿名网友

    :?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

    确定