我創建了一個帶有表單的 PHP 頁面，我在其中使用從資料庫中獲取的資料填充所有輸入。我需要在“Titolo”欄位中，當用戶開始編輯/撰寫某些內容時，必須實時將該值復制并粘貼到“Meta Titolo”欄位中。
我想解決方案可能是一個 JQuery，但我不知道該怎么做：/ 我試過這樣的東西，但肯定行不通
$(document).ready(function() {
$("#editor_titolo" ).on("keyup change", function(e) {
var namer = $('.form-control').attr('#meta_titolo');
$( namer).text($(this).val());
});
});
我的表格的結構是這樣的：
<div class="col-6">
<div >
<div >
<form action="" method="POST" name="traduzione_testo">
<label for="titolo" >Titolo</label>
<input type="text" name='editor_titolo' id='editor_titolo' style="height: 50px;weight: 100px;" placeholder="Titolo" value="<?= isset($titolo_tradotto) ? $titolo_tradotto: ''?>">
</div>
<div >
<label for="meta-titolo" >Meta-Titolo</label>
<input type="text" name='meta_titolo' id='meta_titolo' style="height: 50px;weight: 100px;" placeholder="Meta-Titolo" value="<?=isset($meta_titolo_tradotto) ? $meta_titolo_tradotto: ''?>">
</div>
<div >
<label for="link-rewrite" >Link-Rewrite</label>
<input type="text" name='link-rewrite' id='link-rewrite' style="height: 50px;weight: 100px;" placeholder="Link-rewrite" value="<?=isset($link_rewrite_tradotto) ? $link_rewrite_tradotto: ''?>">
<button onclick="">Genera Rewrite-link</button>
</div>
<div >
<label for="descrizione" >Descrizione</label>
<textarea name='descrizione' id="descrizione" style="weight: 100px;height: 300px" rows="15" placeholder="Descrizione prodotto"><?PHP echo isset($descrizione_tradotto) ? $descrizione_tradotto : '' ?></textarea>
</div>
<div >
<label for="descrizione_breve" >Descrizione breve</label>
<textarea name='descrizione_breve' id="descrizione_breve" style="height: 70px;weight: 100px" rows="15" placeholder="Descrizione breve prodotto" ><?PHP echo isset($descrizione_breve_tradotto) ? $descrizione_breve_tradotto : '' ?></textarea>
</div>
<button type="submit" name="submit" >Salva</button>
</form>
</div>
</div>
uj5u.com熱心網友回復：
不知道你想用.attr("#meta_titolo").
但是你可以這樣做：
$(document).ready(function() {
$("#editor_titolo").on("keyup change", function(e) {
$("#meta_titolo").val($(this).val());
});
});
另請注意，您正在嘗試設定輸入的值，因此您需要使用.val($(this).val())not.text($(this).val())
演示
顯示代碼片段
$(document).ready(function() {
$("#editor_titolo").on("keyup change", function(e) {
$("#meta_titolo").val($(this).val());
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="col-6">
<div class="row">
<div class="col-15">
<form action="" method="POST" name="traduzione_testo">
<label for="titolo" class="form-label form-control-lg">Titolo</label>
<input type="text" name='editor_titolo' id='editor_titolo' class="form-control" style="height: 50px;weight: 100px;" placeholder="Titolo" value="">
</div>
<div class="col-15">
<label for="meta-titolo" class="form-label form-control-lg">Meta-Titolo</label>
<input type="text" name='meta_titolo' id='meta_titolo' class="form-control" style="height: 50px;weight: 100px;" placeholder="Meta-Titolo" value="">
</div>
<div class="col-15">
<label for="link-rewrite" class="form-label form-control-lg">Link-Rewrite</label>
<input type="text" name='link-rewrite' id='link-rewrite' class="form-control" style="height: 50px;weight: 100px;" placeholder="Link-rewrite" value="<?=isset($link_rewrite_tradotto) ? $link_rewrite_tradotto: ''?>">
<button onclick="">Genera Rewrite-link</button>
</div>
<div class="col-15">
<label for="descrizione" class="form-label form-control-lg">Descrizione</label>
<textarea class="form-control" name='descrizione' id="descrizione" style="weight: 100px;height: 300px" rows="15" placeholder="Descrizione prodotto"><?PHP echo isset($descrizione_tradotto) ? $descrizione_tradotto : '' ?></textarea>
</div>
<div class="col-15">
<label for="descrizione_breve" class="form-label form-control-lg">Descrizione breve</label>
<textarea class="form-control" name='descrizione_breve' id="descrizione_breve" style="height: 70px;weight: 100px" rows="15" placeholder="Descrizione breve prodotto"><?PHP echo isset($descrizione_breve_tradotto) ? $descrizione_breve_tradotto : '' ?></textarea>
</div>
<button type="submit" name="submit" class="btn btn-primary btn-lg btn-block mt-2 px-3 mb-3">Salva</button>
</form>
</div>
</div>uj5u.com熱心網友回復：
該attr()方法設定或回傳您不需要的屬性和值！
您只需要meta_titolo id
$(document).ready(function() {
$("#editor_titolo" ).on("keyup change", function(e) {
var namer = $('#meta_titolo');
namer.val($(this).val());
});
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/447496.html
標籤：javascript jQuery 形式