打开/关闭菜单
933
1525
112
1.4万
植物大战僵尸杂交版Wiki
打开/关闭外观设置菜单
打开/关闭个人菜单
未登录
未登录用户的IP地址会在进行任意编辑后公开展示。

微件:GridTable:修订间差异

来自植物大战僵尸杂交版Wiki
创建页面,内容为“<includeonly> <style> .grid-input-area { margin: 10px 0; padding: 12px; background: #f5f5f5; border-radius: 8px; } .grid-input-area textarea { width: 100%; height: 150px; padding: 8px; border: 1px solid #ccc; border-radius: 6px; font-family: monospace; font-size: 13px; resize: vertical; box-sizing: border-box; } .grid-input-area button { margin-top: 8px; padding: 8px 20px; background: #4CAF50;…”
 
无编辑摘要
第29行: 第29行:
}
}
.grid-input-area button:hover { background: #45a049; }
.grid-input-area button:hover { background: #45a049; }
.grid-input-area label { font-size: 13px; color: #888; margin-right: 6px; }
.grid-input-area input[type=number] {
    width: 50px; padding: 4px; border: 1px solid #ccc; border-radius: 4px; text-align: center;
}
.grid-input-area input[type=color] {
    width: 40px; height: 30px; border: 1px solid #ccc; border-radius: 4px; cursor: pointer; vertical-align: middle;
}
.grid-preview {
.grid-preview {
     margin-top: 10px;
     margin-top: 10px;
第36行: 第43行:


<div class="grid-input-area">
<div class="grid-input-area">
     <p style="font-size:13px;color:#888;">每行格式:<b>植物名,列,行</b>(用逗号分隔,一行一个)</p>
     <p style="font-size:13px;color:#888;">每行格式:<b>植物名,列,行</b>(逗号分隔,一行一个)</p>
     <textarea id="grid-data" placeholder="豌豆向日葵,1,1&#10;豌豆射手,2,1&#10;向日葵,6,3&#10;坚果墙,7,5"></textarea>
     <textarea id="grid-data" placeholder="豌豆向日葵,1,1&#10;豌豆射手,2,1&#10;向日葵,6,3&#10;坚果墙,7,5"></textarea>
     <br>
     <br>
     <label>列数:<input type="number" id="grid-cols" value="9" min="1" max="20" style="width:50px;"></label>
     <label>列数:<input type="number" id="grid-cols" value="9" min="1" max="20"></label>
     <label>行数:<input type="number" id="grid-rows" value="5" min="1" max="15" style="width:50px;"></label>
     <label>行数:<input type="number" id="grid-rows" value="5" min="1" max="15"></label>
    <label>背景色:<input type="color" id="grid-bg" value="#2d2d2d"></label>
    <label>格子色:<input type="color" id="grid-cell" value="#3a3a3a"></label>
    <label>边框色:<input type="color" id="grid-border" value="#555555"></label>
     <button id="grid-generate">生成表格</button>
     <button id="grid-generate">生成表格</button>
     <button id="grid-copy" style="background:#888;">复制代码</button>
     <button id="grid-copy" style="background:#888;">复制代码</button>
第53行: 第63行:
         var cols = parseInt($('#grid-cols').val()) || 9;
         var cols = parseInt($('#grid-cols').val()) || 9;
         var rows = parseInt($('#grid-rows').val()) || 5;
         var rows = parseInt($('#grid-rows').val()) || 5;
        var bg = $('#grid-bg').val() || '#2d2d2d';
        var cell = $('#grid-cell').val() || '#3a3a3a';
        var border = $('#grid-border').val() || '#555555';
         var lines = raw.split('\n');
         var lines = raw.split('\n');
         var data = {};
         var data = {};
第63行: 第76行:
                 var row = parseInt(parts[2].trim());
                 var row = parseInt(parts[2].trim());
                 if (name && col >= 1 && row >= 1) {
                 if (name && col >= 1 && row >= 1) {
                     var key = row + '-' + col;
                     data[row + '-' + col] = name;
                    data[key] = name;
                 }
                 }
             }
             }
         });
         });


         var table = '{| style="width:100%;max-width:900px;table-layout:fixed;text-align:center;background:#2d2d2d;border-collapse:collapse;"\n';
         var table = '{| style="width:100%;max-width:900px;table-layout:fixed;text-align:center;background:' + bg + ';border-collapse:collapse;"\n';
         table += '|-\n! !!';
         table += '|-\n! !!';
         for (var c = 1; c <= cols; c++) table += ' 列' + c + ' !!';
         for (var c = 1; c <= cols; c++) table += ' 列' + c + ' !!';
第77行: 第89行:
             table += '|-\n! 行' + r + '\n';
             table += '|-\n! 行' + r + '\n';
             for (var c = 1; c <= cols; c++) {
             for (var c = 1; c <= cols; c++) {
                 var key = r + '-' + c;
                 var plant = data[r + '-' + c];
                var plant = data[key];
                 if (plant) {
                 if (plant) {
                     table += '| style="height:80px;border:2px solid #555;background:#3a3a3a;" | [[' + plant + '|50px|link=' + plant + ']]\n';
                     table += '| style="height:80px;border:2px solid ' + border + ';background:' + cell + ';" | [[' + plant + '|50px|link=' + plant + ']]\n';
                 } else {
                 } else {
                     table += '| style="height:80px;border:2px solid #555;background:#3a3a3a;" | \n';
                     table += '| style="height:80px;border:2px solid ' + border + ';background:' + cell + ';" | \n';
                 }
                 }
             }
             }
第103行: 第114行:
     });
     });


    // 初始生成
     generate();
     generate();
})();
})();
</script>
</script>
</includeonly>
</includeonly>

2026年7月10日 (五) 03:29的版本