第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會有你想問的

如何使用 jQuery 顯示文本框中列表中的選定選項(xiàng)?

如何使用 jQuery 顯示文本框中列表中的選定選項(xiàng)?

三國紛爭 2023-05-19 15:08:47
我有以下表格:在我的簡單 mvc 模型中(下面是我的視圖,此代碼填充值):    @foreach (var item in Model)    {        <tr>            <td>                @Html.DisplayFor(modelItem => item.ID)            </td>            <td>                @Html.DisplayFor(modelItem => item.CustomerName)            </td>                <select id="decisionList" name="@item.ID">                    <option selected value="b"></option>                    <option value="n">None</option>                    <option value="c">Cancellation</option>                    <option value="d">Date of payment</option>                </select>            </td>            <td>                <input id="choice" name="@item.ID" type="text">            </td>            <td>        </tr>    }我想要做的是在相應(yīng)的文本框中顯示所選列表中的文本(因此我在第 3 行中為“選擇”列選擇了一些選項(xiàng),并在“決定”列的第 3 個(gè)文本框中查看此文本)。我嘗試了不同的方法,我添加了 attr 'name' 和 @item.ID 以通過模型中的 ID 定義每個(gè)行字段(注意:'name' 在數(shù)字后有空格')我寫了一些js。- 目標(biāo)是在更改選擇時(shí)輸入選定的文本。:$('select#decisionList').change(function () {    var textSelected = $(this).find(':selected').text();    var nameSelected = $(this).attr('name');    $('#choice').attr("[name*='"+ nameSelected +"']").val(textSelected);   });它根本不起作用。我不知道該怎么做?!癋oreach”為每個(gè)“名稱”正確分配 ID,如上圖所示。你知道如何在相應(yīng)的(在本例中是旁邊的字段)字段中顯示選定的文本嗎?也許我在這里展示的方法沒用
查看完整描述

1 回答

?
米琪卡哇伊

TA貢獻(xiàn)1998條經(jīng)驗(yàn) 獲得超6個(gè)贊

  • 獲取選中的選項(xiàng)索引?HTMLSelectElement/selectedIndex

  • 使用SelectElement.options[?index?]定位 OPTION 元素

  • 使用 jQuery 的.closest()?方法引用公共 TR 父級

  • 使用 jQuery 的.find()方法查找元素

$('.decisionList').on("change", function() {

? const i = this.selectedIndex;

? $(this).closest("tr").find(".choice").val(this.options[i].textContent);

});

<table>

? <tr>

? ? <td>111</td>

? ? <td>Anna</td>

? ? <td>

? ? ? <select class="decisionList">

? ? ? ? <option selected value="b"></option>

? ? ? ? <option value="n">None</option>

? ? ? ? <option value="c">Cancellation</option>

? ? ? ? <option value="d">Date of payment</option>

? ? ? </select>

? ? </td>

? ? <td><input class="choice" name="111" type="text"></td>

? </tr>

? <tr>

? ? <td>222</td>

? ? <td>John</td>

? ? <td>

? ? ? <select class="decisionList">

? ? ? ? <option selected value="b"></option>

? ? ? ? <option value="n">None</option>

? ? ? ? <option value="c">Cancellation</option>

? ? ? ? <option value="d">Date of payment</option>

? ? ? </select>

? ? </td>

? ? <td><input class="choice" name="222" type="text"></td>

? </tr>

</table>




<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


或者以更 jQuery 的方式使用這種方式:


$('.decisionList').on("change", function() {

? const $option = $(this).find(":selected");

? $(this).closest("tr").find(".choice").val($option.text());

});


查看完整回答
反對 回復(fù) 2023-05-19
  • 1 回答
  • 0 關(guān)注
  • 128 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號