简体   繁体   English

图标不显示

[英]Icon doesn't show

I am trying to display icon after text, like start (*) which will represent Arbitration for medical providers.我试图在文本后显示图标,例如开始(*),它将代表医疗提供者的仲裁。

    <tbody>                                                   
   @{  
 int i = 0;


foreach (var item in medProviders)
 {
     if (item.Arb==true) { 
<tr class="sortList" style="cursor:pointer" id="increment-@i" data-id="@item.Id" data-lat="@item.Latitude" data-long="@item.Longitude">
                                                                    <td>@item.Firstname 
br/>
<i class="fa fa-heart"></i>
</td>                                                                       
 <td id="distance-@i"></td>
<td id="duration-@i"></td>                                                                                                                                                                                                                                             
</tr>
 i++;
    }
      }
         }

</tbody>

Something like this:像这样的东西:

在此处输入图片说明

OnClick Script点击脚本

$(".town").click(function () {
    $.getJSON("/NfDocuments/LoadMedicalProviders", { town: $(this).attr('data-town') },
        function (data) {
            $('#medProviders').empty();
            var p = 0;
            $.each(data, function () {
                $("#medProviders").append("<tr class='sortList' style='cursor:pointer' id='increment-" + p + "' data-id='" + this.Id + "'  data-lat='" + this.Lat + "' data-long='" + this.Lon + "'><td>" + this.Title +" <span><i class='fa fa-heart'></i></span> </td><td id='distance-" + p + "'><br/></td><td id='duration-" + p + "'></td></tr>");

                p++;
            });
        });
});

Take A look on the click function看看点击功能

 <!DOCTYPE html> <html lang="en"> <head> <title>Bootstrap Example</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"/> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css"> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <button type="button" class="btn btn-primary mybtn" data-toggle="modal" data-target="#myModal"> Click To add Icon </button> <table border="1" class="nytable"> <th>Name</th> <th>Icon</th> <tr> <td>Blah</td> <td><i class="fa fa-heart"></i></td> </tr> </table> </div> <script> $('.mybtn').click(function(){ $('.nytable').append('<tr><td>Blah</td><td><i class="fa fa-heart"></i></td><tr>') }); </script> </body> </html>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM