我一直在嘗試將我的產(chǎn)品名稱的值更改為當(dāng)前的值+尺寸名稱，但我無法做到這一點。我嘗試使用HTML <select> 選項用 HTML 內(nèi)容填充文本區(qū)域，但失敗了。這是 HTML，我正在嘗試將產(chǎn)品名稱更改為產(chǎn)品名稱 + 從選項中選擇的任何選項。我嘗試過這個，但似乎沒有改變?nèi)魏螙|西。var text = document.getElementById('name');var drop = document.getElementById('dropdown');drop.addEventListener('change', function(e) { text.value += ' ' + e.target.value; //OR ` ${e.target.value}`})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><!-- BEGIN PRODUCTS --><div class="col-md-4 col-sm-6"> <div class="sc-product-item thumbnail"> <div class="caption"> <h4 id="name" data-name="product_name">Product Name</h4> <p data-name="product_desc">Yellow</p> <hr class="line"> <div> <div class="form-group"> <label>Size: </label> <select id="dropdown" name="product_size" class="form-control input-sm"> <option>Iphone 11 6.1</option> <option>IPhone 11 Pro 5.8</option> <option>Iphone 11 Pro Max 6.5</option> <option>Iphone X</option> <option>Iphone XS</option> <option>Iphone XS Max</option> <option>Iphone XR</option> <option>Iphone 7</option> <option>Iphone 8</option> <option>Iphone 7 Plus</option> <option>Iphone 8 Plus</option> <option>Iphone 6</option> <option>Iphone 6s</option> <option>Iphone 6 Plus</option> <option>Iphone 6s Plus</option> </select> </div>
1 回答
慕桂英3389331
TA貢獻2036條經(jīng)驗 獲得超8個贊
提供您的 JS 元素 ID，然后更改text.value為text.textContent. 另外，請確保每次都替換文本，而不是添加文本（即text.textContent = 'Product Name: ' + ...）：
var text = document.getElementById('name')
var drop = document.getElementById('dropdown')
drop.addEventListener('change', function(e) {
text.textContent = 'Product Name: ' + e.target.value
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="caption">
<h4 data-name="product_name" id="name">Product Name</h4>
<p data-name="product_desc">Yellow</p>
<hr class="line">
<div class="form-group">
<label>Size: </label>
<select id="dropdown" name="product_size" class="form-control input-sm">
<option>Iphone 11 6.1</option>
<option>IPhone 11 Pro 5.8</option>
<option>Iphone 11 Pro Max 6.5</option>
<option>Iphone X</option>
<option>Iphone XS</option>
<option>Iphone XS Max</option>
<option>Iphone XR</option>
<option>Iphone 7</option>
<option>Iphone 8</option>
<option>Iphone 7 Plus</option>
<option>Iphone 8 Plus</option>
<option>Iphone 6</option>
<option>Iphone 6s</option>
<option>Iphone 6 Plus</option>
<option>Iphone 6s Plus</option>
</select>
</div>
</div>
- 1 回答
- 0 關(guān)注
- 172 瀏覽
添加回答
舉報
0/150
提交
取消