تغییر عناصر یک DropDown با jQuery

بسم الله الرحمن الرحیم

ممکن است شما نیاز داشته باشید، برخی از عناصر یک Drop Down را با استفاده jQuery حذف و یا Hidden کنید برای این کار می توانید به صورت زیر عمل کنید:

<html>
<head>
    <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
    <select id="MyDropDown">
        <option value="1">Ably.ir</option>
        <option value="2">__________________ ABLY ____________</option>
        <option value="3">yahoo.com</option>
        <option value="2">google.com</option>
    </select>

    <button type="button" onclick="HiddenOptionInDropDown(2)">Hidden Secound Item</button>


    <script>  
        function HiddenOptionInDropDown(id) {
            $("#MyDropDown option").css("display", "block"); // show all hidden option
            $("#MyDropDown option[value='" + id + "']").css("display", "none"); // hidden current option
        }
    </script>
</body>

</html>

در کد بالا ما توسط یک button دومین عنصر Drop Down را مخفی می کنیم.

در صورتی که بخواهید یک option  را از دراپ دان حذف کنید می توانید به صورت زیر عمل کنید

$('#MyDropDown option[value!="2"]').remove();

در صورتی که بخواهید همه ی گزینه های یک دراپ دان را حذف کنید، می توانید از کد زیر استفاده کنید

$('#MyDropDown')
    .find('option')
    .remove()
    .end()
    .append('<option value="whatever">text</option>')
    .val('whatever');

نظرات (۰)

هيچ نظري هنوز ثبت نشده است
ارسال نظر آزاد است، اما اگر قبلا در بیان ثبت نام کرده اید می توانید ابتدا وارد شوید.
شما میتوانید از این تگهای html استفاده کنید:
<b> یا <strong>، <em> یا <i>، <u>، <strike> یا <s>، <sup>، <sub>، <blockquote>، <code>، <pre>، <hr>، <br>، <p>، <a href="" title="">، <span style="">، <div align="">
تجدید کد امنیتی