如何使用表格更改我的 HTML 頁面？

Question

我將解釋我的問題，我有一個帶有許多按鈕的 HTML 頁面“索引”（所有 Href 都鏈接到其他站點），我想創建一個單獨編寫基本代碼的表單。

我認為一個例子會更好地解釋，這個表單是為非開發人員設計的，3 個輸入（名稱、href、圖片），當你使用這個表單時，它會使用一個已經鏈接到其他網站的新按鈕來更新索引頁面。

我正在考慮創建許多帶有 display: none 的按鈕，並更新這些按鈕。 或者已經寫好了可以填補的劇本。

即使您刷新頁面，我也希望這些新按鈕保留。

我的索引如下所示：

@{
ViewData["Title"] = "Index";
}

<div style="background-image: url('img/LOGOFIVES.jpg');">
    <div class="text-center">
        <h5 class="my-4">Bienvenue sur le portail Fives.</h5>
        <div class="row m-4">
            <div class="col-12 col-md-6 col-lg-4 col-xl-3 my-2">
                <a asp-controller="Order" asp-action="Index" class="btn btn-lg btn-primary btn-block">Ordres</a>
            </div>
            <div class="col-12 col-md-6 col-lg-4 col-xl-3 my-2">
                <a asp-controller="Article" asp-action="Index" class="btn btn-lg btn-primary btn-block">Articles</a>
            </div>
            <div class="col-12 col-md-6 col-lg-4 col-xl-3 my-2">
                <a href="http://eclqualios/" class="btn btn-lg btn-primary btn-block">Portail Qualios</a>
            </div>
            <div class="col-12 col-md-6 col-lg-4 col-xl-3 my-2">
                <a href="https://fioriprd.global.fivesgroup.com:44300/sap/bc/ui5_ui5/ui2/ushell/shells/abap/Fiorilaunchpad.html" class="btn btn-lg btn-primary btn-block">Saphir</a>
            </div>
            <div class="col-12 col-md-6 col-lg-4 col-xl-3 my-2">
                <a href="http://eclnet/md/" class="btn btn-lg btn-primary btn-block">Base Qualité</a>
            </div>
            <div class="col-12 col-md-6 col-lg-4 col-xl-3 my-2" onclick="alert([message?: veuillez utiliser Internet Explorer pour utiliser Chronogestor sans problème])">
                <a href="http://chronogestor/salaries/" class="btn btn-lg btn-primary btn-block">Chronogestor</a>
            </div>
            <div class="col-12 col-md-6 col-lg-4 col-xl-3 my-2">
                <a href="http://eclnet/" class="btn btn-lg btn-primary btn-block">Intranet Fives ECL</a>
            </div>
            <div class="col-12 col-md-6 col-lg-4 col-xl-3 my-2">
                <a href="https://portal.fivesgroup.com/" class="btn btn-lg btn-primary btn-block">Portail Fives</a>
            </div>
        </div>
    </div>
</div>

Answer 1

如果您希望其他人看到這些新添加的鏈接/按鈕，您必須使用一些后端語言（例如 PHP）和數據庫來存儲這些鏈接。 據我所知，沒有任何后端語言或服務器端應用程序，您無法更新 HTML 代碼，但如果可以，它既不實用也不常用。

你想要的不是太復雜，所以一些后端語言的基本知識就足夠了。

祝你好運！

PS 如果您的意思是只為當前用戶更新這些按鈕，直到他們刷新頁面，那是一個完全不同的故事，您可以使用 JavaScript 來完成。

Answer 2

如果您也想僅為用戶更改視圖，您可以使用 java 腳本使用此 function 執行此操作

function add_button(text, href){
    let b = document.createElement("a");
    let t = document.createTextNode(text);
    b.appendChild(t);
    b.setAttribute("href", href)
    let element = document.getElementById("div");
    element.appendChild(b);
}

只需從表單中的提交按鈕調用它