簡體   English   中英

jQuery代碼,單擊單選按鈕選擇一個選項

[英]Jquery code, clicking on radio button selects an option

您好,Html / Java(script / query)/ css的新用戶大約半年了。
我有幾個問題。
現在,我正在嘗試使功能/代碼執行此操作:我有2個單選按鈕。
單擊第一個單選按鈕選擇第一個選項,然后刪除其他選項。
在單擊第二個單選按鈕時,打開其他選項,並刪除將其自身專用於第一個單選按鈕的第一個選項。

<form  enctype="multipart/form-data">
    <fieldset>
        <legend>מפרט טכני של הסמארטפון:</legend>
        <label for="memory">זיכרון פנימי:</label>
        <input id="less1" type="radio" value="less" name="memory" onclick="(myFun())" /> פחות מ 1GB
        <input id="more1" type="radio" value="more" name="memory" onclick="(myFun1())" />מעל 1GB
        <br />
        <label for="extra">אפשרות להרחבת זיכרון:</label>
        <br />
        <select size="5" id="sel">
            <option name="extra" value="no1" id="no">לא</option>
            <option name="extra" value="yes8">כן,8GB</option>
            <option name="extra" value="yes16">כן,16GB</option>
            <option name="extra" value="yes32">כן,32GB</option>
            <option name="extra" value="yes64">כן,64GB</option>
        </select>
        </fieldset>
</form>

        function myFun() {
        $("#sel").prop('size', "1")
        select('option', $("no")).select('option:not(:selected)').remove()         
    }
    function myFun1() {
        $("#sel").prop('size',"4")
    }

我在這里檢查了另一個主題,它對我有一點幫助( 更改時的jQuery僅顯示所選選項,刪除/禁用其余選項

那就是執行您想要的代碼。 我刪除了select()事件,因為當使用鼠標選擇文本時會觸發該事件。

最好隱藏/顯示元素而不是刪除它們。

function myFun() {

    // 1. Find the first option and set as selected
    $("#sel").find('option').first().prop("selected",true)
    // 2. Find its not selected siblings and hide it
    .siblings('option:not(:selected)').hide();

    // 3. The first radio button is selected, so show the first option
    $("#no").show();

}

function myFun1() {

    // 1. Find the last option, set as selected and show it
    $("#sel").find('option').last().prop("selected",true).show()
    // 2. Find its siblings and show them
    .siblings('option:not(:selected)').show();

    // 3. Hide the first option
    $("#no").hide();

}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM