拉拉維爾！ 如何將收藏價值與收藏價值進行比較<input>文本？

Question

當用戶單擊按鈕時，我需要將集合項值與刀片模板中的文本進行比較。

像這樣的東西

@foreach notes as note

@if $note->number == <input id="number" name="number">

<h2>$note->contente</h2>

@endif

@endforeach

請問我該如何進行這種比較？

Answer 1

這必須通過 Javascript 完成，Blade 在您的 Javascript 加載或輸入更改之前輸出 HTML 方式

這是一個例子（不要復制粘貼）

@foreach($notes as $note)

<h2 hidden>{{ $note->name }}</h2>
<input id="number" name="number"><br>

@endforeach
<button onclick="showCorrectNames()">Check</button>
<script>
    function showCorrectNames() {
        var inputs = document.getElementsByTagName("input");
        for (let input of inputs) {
            if (input.value === input.previousElementSibling.innerText) {
                input.previousElementSibling.hidden = false;
            }
        }
    }
</script>

解釋：

• 始終將標題標記為默認隱藏
• 在它旁邊放置一個輸入並在單擊按鈕時查詢它的值
• 監聽按鈕上的點擊事件，執行一個 Javascript function
• 獲取所有輸入元素的完整列表
• 遍歷 HTML 集合
• 如果輸入值與 DOM 中的前一個標題值（內部文本）匹配
• 將標題的隱藏屬性設置為 false

現場示例：

 function showCorrectNames() { var inputs = document.getElementsByTagName("input"); for (let input of inputs) { if (input.value === input.previousElementSibling.innerText) { input.previousElementSibling.hidden = false; } } }

 <h2 hidden>Cecelia Denesik Jr.</h2> <input id="number" name="number"><br> <h2 hidden>Cristian McCullough</h2> <input id="number" name="number"><br> <h2 hidden>Forest Pollich</h2> <input id="number" name="number"><br> <h2 hidden>Mckenna Jacobson</h2> <input id="number" name="number"><br> <h2 hidden>Rudolph Luettgen MD</h2> <input id="number" name="number"><br> <h2 hidden>Mazie Shields III</h2> <input id="number" name="number"><br> <h2 hidden>Mr. Arlo Hudson Sr.</h2> <input id="number" name="number"><br> <h2 hidden>Joanie Rogahn</h2> <input id="number" name="number"><br> <h2 hidden>Stephan Feil</h2> <input id="number" name="number"><br> <h2 hidden>Isadore Schultz</h2> <input id="number" name="number"><br> <button onclick="showCorrectNames()">Check</button>

我希望這有幫助