jQuery - ইনপুট উপাদানটি পাঠ্যবক্স বা নির্বাচন তালিকা নির্বাচন করুন কিনা তা নির্ধারণ করুন


90

আমি কীভাবে এটি নির্ধারণ করব যে উপাদানটি একটি দ্বারা ফিরে এসেছে: jQuery এ ইনপুট ফিল্টার একটি পাঠ্যবক্স বা নির্বাচন তালিকা?

আমি প্রত্যেকের জন্য আলাদা আচরণ করতে চাই (পাঠ্যবক্সটি পাঠ্যের মান প্রদান করে, কী এবং পাঠ্য উভয়ই প্রদান করে নির্বাচন করুন)

উদাহরণস্বরূপ সেটআপ:

<div id="InputBody">
<div class="box">
    <span id="StartDate">
        <input type="text" id="control1">
    </span>
    <span id="Result">
        <input type="text" id="control2">
    </span>
    <span id="SelectList">
        <select>
            <option value="1">Option 1</option>
            <option value="2">Option 2</option>
            <option value="3">Option 3</option>
        </select>
    </span>
</div>
<div class="box">
    <span id="StartDate">
        <input type="text" id="control1">
    </span>
    <span id="Result">
        <input type="text" id="control2">
    </span>
    <span id="SelectList">
        <select>
            <option value="1">Option 1</option>
            <option value="2">Option 2</option>
            <option value="3">Option 3</option>
        </select>
    </span>
</div>

এবং তারপর স্ক্রিপ্ট:

$('#InputBody')
    // find all div containers with class = "box"
    .find('.box')
    .each(function () {
        console.log("child: " + this.id);

        // find all spans within the div who have an id attribute set (represents controls we want to capture)
        $(this).find('span[id]')
        .each(function () {
            console.log("span: " + this.id);

            var ctrl = $(this).find(':input:visible:first');

            console.log(this.id + " = " + ctrl.val());
            console.log(this.id + " SelectedText = " + ctrl.find(':selected').text());

        });

উত্তর:


167

আপনি এটি করতে পারেন:

if( ctrl[0].nodeName.toLowerCase() === 'input' ) {
    // it was an input
}

বা এটি, যা ধীর, তবে খাটো এবং ক্লিনার:

if( ctrl.is('input') ) {
    // it was an input
}

আপনি যদি আরও নির্দিষ্ট হতে চান তবে আপনি প্রকারটি পরীক্ষা করতে পারেন:

if( ctrl.is('input:text') ) {
    // it was an input
}

4
এটি কাজ করতে আমাকে jquery সিনট্যাক্স element (উপাদান) .is ('ইনপুট') যুক্ত করতে হয়েছিল তবে সর্বোপরি দুর্দান্ত।
পর্যবেক্ষক

28

বিকল্পভাবে আপনি এর সাথে DOM বৈশিষ্ট্য পুনরুদ্ধার করতে পারেন .prop

এখানে নির্বাচিত বাক্সের জন্য নমুনা কোড রয়েছে

if( ctrl.prop('type') == 'select-one' ) { // for single select }

if( ctrl.prop('type') == 'select-multiple' ) { // for multi select }

পাঠ্যবক্সের জন্য

  if( ctrl.prop('type') == 'text' ) { // for text box }

এটি নতুন jQuery ফাংশন প্রপ () এর সাথে একটি কবিতার মতো কাজ করে। ধন্যবাদ
থমাস.বেনজ

8

আপনি যদি কেবল প্রকারটি পরীক্ষা করতে চান তবে আপনি jQuery এর .is () ফাংশনটি ব্যবহার করতে পারেন,

আমার ক্ষেত্রে যেমন আমি নীচে ব্যবহার করেছি,

if($("#id").is("select")) {
 alert('Select'); 
else if($("#id").is("input")) {
 alert("input");
}
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.