Question

我有一个php脚本，显示来自worldoftanks api服务器的数据。我在表格中显示这些数据，所以我想在排名为＆＃34; Recruit＆＃34;。

的每个用户附近添加图像。

这是我的javascript for table：

    <script type="text/javascript">

                    $(document).ready(function(){
                        $.ajax({
                            type: "POST",
                            url: "clan_info.php",
                            success: function(data){
                                var htmlString = '<table cellpadding="0px" class="menu1"><tr><th>Username</th><th>Rank</th><th>PR</th><th>BTL</th><th>W/B</th><th>E/B</th><th>Days</th></tr>';
                                var clanData = JSON.parse(data);
                                i = 0;
                                for(userID in clanData){
                                    userData = clanData[userID];
                                    var extraClass = '';
                                    if(i < 3) {
                                        extraClass = 'class="rank' + (i+1) + '"';
                                    }
                                    htmlString += '<tr>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['name'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['role'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['rating'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['battles'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['w_p_b'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['xp_p_b'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['days'] + '</a></td>';
                                    htmlString += '</tr>';
                                    i++;
                                }
                                htmlString += '</table>';
                                console.log(htmlString);
                                $("#wot").html(htmlString);
                            }

                        });
                    });

                </script>

和我的PHP脚本：

＆＃13;

<?php
$clanID = "500006494";
$clanApiPage = "https://api.worldoftanks.eu/wgn/clans/info/?application_id=demo&clan_id=$clanID";
$userApiPage = "https://api.worldoftanks.eu/wot/account/info/?application_id=demo&account_id=";
$clanStrongHoldPage = "https://developers.wargaming.net/reference/all/wot/stronghold/info?application_id=demo&clan_id=$clanID";

$getAndDecode = function($url) {
	$jsonData = file_get_contents($url);			
	$dataArray = json_decode($jsonData, true);
	return $dataArray;
};
$determineDays = function($date) {
	$datediff = time() - $date;
	return floor($datediff/(60*60*24));
};
$jsonData = $getAndDecode($clanApiPage) , ($clanStrongHoldPage);
$clanAccounts = array();
foreach($jsonData["data"][$clanID]["members"] as $memberArray) {
	$accountID = $memberArray["account_id"];
	$clanAccounts[$accountID]['id'] = $memberArray["account_id"];
	$clanAccounts[$accountID]['role'] = $memberArray["role_i18n"];
	$clanAccounts[$accountID]['name'] = $memberArray["account_name"];
	$clanAccounts[$accountID]['days'] = $determineDays($memberArray["joined_at"]);
}
$accountIDs = implode(",", array_keys($clanAccounts));
$apiPage = $userApiPage . $accountIDs;
$userJsonData = $getAndDecode($apiPage);
foreach($userJsonData["data"] as $userID => $dataArray) {
	$playerStatistic = $dataArray["statistics"]["all"];
	$clanAccounts[$userID]['rating'] = $dataArray["global_rating"];
	$clanAccounts[$userID]['battles'] = $playerStatistic["battles"];
	$clanAccounts[$userID]['w_p_b'] = $playerStatistic["wins"]/$playerStatistic["battles"] * 100;//wins per battle
	$clanAccounts[$userID]['xp_p_b'] = $playerStatistic["battle_avg_xp"]; //experience per battle
}
$w_p_b = array();
foreach ($clanAccounts as $userID => $row) {
	$w_p_b[$userID] = $row['w_p_b'];
}
array_multisort($w_p_b, SORT_DESC, $clanAccounts);
die(json_encode($clanAccounts));
?>

＆＃13;

我的表格示例：http://www.slovenian-army.tk/members.html

我想将图像放在每个用户附近，如下所示： sloa_clan

取决于用户的等级。如果用户是Comander，他会获得指挥官图标如果用户是Recruit，他会获得Recruit图标。

谢谢！

Answer 1

我发现如何做到这一点。通过添加此var：

var username = '<img src="images/'  + userData['role'] + '.png" height="25" width="25"   />' + userData['name'];

现在代码如下：

<script type="text/javascript">
                    $(document).ready(function(){
                        $.ajax({
                            type: "POST",
                            url: "clan_info.php",
                            success: function(data){
                                var htmlString = '<table cellpadding="0px" class="menu1"><tr><th>Username</th><th>Rank</th><th>PR</th><th>BTL</th><th>W/B</th><th>E/B</th><th>Days</th></tr>';
                                var clanData = JSON.parse(data);
                                i = 0;
                                for(userID in clanData){
                                    userData = clanData[userID];
                                    var extraClass = '';
                                    if(i < 3) {
                                        extraClass = 'class="rank' + (i+1) + '"';
                                    }
                                    var username = '<img src="images/'  + userData['role'] + '.png" height="25" width="25"   />' + userData['name'];
                                    htmlString += '<tr>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + username + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['role'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['rating'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['battles'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['w_p_b'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['xp_p_b'] + '</a></td>';
                                    htmlString += '<td '+extraClass+'><a href="http://worldoftanks.eu/en/community/accounts/' + userData['id'] +'" target="_blank">' + userData['days'] + '</a></td>';
                                    htmlString += '</tr>';
                                    i++;
                                }
                                htmlString += '</table>';
                                console.log(htmlString);
                                $("#wot").html(htmlString);
                            }
                        });
                    });
                </script>

jquery如何在表TD附近添加指定文本的图像

1 个答案: