Question

我正在建立一个搜索引擎优化脚本，现在推迟了这个问题2个星期没有答案。我在这里看到了几十个答案，但没有一个令人满意（或者至少我没有发现它们有用）。

我有一个包含多个字段的MySQL表，数据库的关键字字段为primary，其他字段是相关关键字的SEO变量。好的，没问题，我将MySQL值放在表中，当php请求时，它们会吐出一个漂亮的表...

我在每行的开头都有一个圆形按钮，表示关键字是简单，中等还是难以优化。尊重绿色按钮，橙色按钮和红色按钮。每行只显示一个。

颜色由页面排名（表格中的一列，0-10（<2 - 绿色，2-4橙色，超过4红色））确定。

所以我的问题很简单......

我想点击这些按钮，图片或您要调用它们并选择它们，它们将变为蓝色（用蓝色图像替换图像），然后它们可以包含在.CSV文件中出口。

所以，我会告诉你我的代码，但我已经多次改变它，我认为它没有任何好处，也没有重要意义，但我可以回答任何问题。

基本上它是在ONCLICK的基础上使用mysql和php来回更改2张图像。

这是葡萄牙语的一半所以我会翻译......

$query = "SELECT `CÔR`(COLOR), `keyword`, `Adds`, `PRMédio`, `PRDomínioMédio`, `Searches`, `CPC`, `.com`, `.org`, `.net`, `All in URL`, `All in Title`, `All in Desc.` FROM keywords";

if ($query_run = mysql_query($query)) {
    while ($query_row = mysql_fetch_assoc($query_run)) {
        (COLOR)$côr = $query_row['CÔR'];
            $keyword = $query_row['keyword'];
            $Adds = $query_row['Adds'];

            $PRMédio = $query_row['PRMédio'];
            $PRDomínioMédio = $query_row['PRDomínioMédio'];
            $Searches = $query_row['Searches'];
            $CPC = $query_row['CPC'];
            $com = $query_row['.com'];
            $org = $query_row['.org'];
            $net = $query_row['.net'];
            $All_in_URL = $query_row['All in URL'];
            $All_in_Title = $query_row['All in Title'];
            $All_in_Desc = $query_row['All in Desc.'];


            echo "
            <tr>

            <th>";
            if ($PRMédio < 2) {
                echo "(GREEN BUTTON)$botao_verde";
            } else if ((2 <= $PRMédio) && ($PRMédio < 4)) {
                echo "(ORANGE BUTTON)$botao_laranja";
            } else if (4 < $PRMédio) {
                echo "(RED BUTTON)$botao_vermelho";
            }

            // this is the part where i do not know what I'm doing

            echo "<form>
                <input type='submit' name='submit' class='image'
                value=(BUTTON)'botão' onClick='UPDATE keywords SET CÔR = ~CÔR'>";
            echo "</form>
            </th>
            <td>$keyword</td>
            <td>$Adds</td>
            <td>

继续使用表格的其他列...

Answer 1

这应该让您入门 - 您需要做的就是为您的行生成适当的HTML，如下所示

的Javascript

var PathToImages = "/Images/";

// Let's store the initial colours in in array so we know what to toggle back to...
var Colors = ["Red", "Blue"];

// And set up somewhere to record which ones have been clicked...
var Toggled = [];

//Using jQuery this might look more elegant but I'll keep it simple

function Toggle(RowNumber) { //RowNumber is 0-indexed
    var NewImageSource;
    if(Toggled.indexOf(RowNumber) < 0) {
        //Toggle on
        Toggled.push(RowNumber);
        NewImageSource = PathToImages + "Blue.png";
    } else {
        //Toggle off
        Toggled.splice(Toggled.indexOf(RowNumber), 1); //Remove the Row number from the toggled array
        NewImageSource = PathToImages + Colors[RowNumber] + ".png";
    }
    document.getElementById("Image" + RowNumber).src = NewImageSource;
}

HTML

<img src="/Images/Red.png" id="Image0" onclick="toggle(0);"/>
<img src="/Images/Green.png" id="Image1" onclick="toggle(1);"/>

Answer 2

你可以尝试这个 -

DEMO here

function main() {
    "use strict";
    var toggles = document.querySelectorAll('img.toggle'), i;
    for (i=0; i < toggles.length; i++) {
        toggles[i].addEventListener('click', toggle);
    }
}
function toggle() {
    "use strict";
    this.src = (this.src == "blue.jpg") ? "red.jpg" ? "blue.jpg";
}
window.addEventListener('load', main);

更新

您正在将服务器端代码与客户端代码混合使用。这个 -

<input type='submit' name='submit' class='image' value=(BUTTON)'botão' 
onClick='UPDATE keywords SET CÔR = ~CÔR'>

永远不会（从不）开始工作。您无法从JavaScript执行数据库查询。您需要在服务器和客户端之间建立桥梁。简单来说，您需要AJAX，Mozilla Developers Network有一套很好的教程可以帮助您入门。

Onclick，MySQL，PHP，关于交换图像

2 个答案:

HTML

更新