একটি ডিভ উপাদান (jQuery) এর সমস্ত সন্তানের ইনপুটগুলি কীভাবে পাবেন


158

এইচটিএমএল:

<div id="panel">
  <table>
    <tr>
       <td><input id="Search_NazovProjektu" type="text" value="" /></td>
    </tr>
    <tr>
       <td><input id="Search_Popis" type="text" value="" /></td>
    </tr>
  </table>
</div>

আমার বিশেষ ডিভের সমস্ত ইনপুট নির্বাচন করতে হবে।

এটি কাজ করছে না:

var i = $("#panel > :input");

উত্তর:


301

এর চেয়ে বড় ছাড়াই এটি ব্যবহার করুন:

$("#panel :input");

>মানে শুধুমাত্র সরাসরি উপাদান শিশু, যদি আপনি সেই সমস্ত শিশুদের গভীরতা কোন ব্যাপার চান শুধু একটি স্থান ব্যবহার করুন।


3
আকর্ষণীয় ... এখন আমি বিভ্রান্ত ... :সেগুলি সিউডো-ক্লাসের জন্য, তাই না? তবে আমরা একটি উপাদান টাইপ নির্বাচন করতে চান। কেন :?
mnemosyn

11
@ মনিমোসিন - এটি type: চেকবক্স'-এর মতো আরেক ধরণের নির্বাচক, বিশদের জন্য এখানে দেখুন: api.jquery.com/input-selector এবং এগুলির আরও একটি সম্পূর্ণ তালিকা এখানে রয়েছে: api.jquery.com/category/selectors/form -selectors
নিক Craver

74

তোমার দরকার

var i = $("#panel input"); 

বা , আপনি ঠিক কী চান তার উপর নির্ভর করে (নীচে দেখুন)

var i = $("#panel :input"); 

The >শিশুদের সীমিত হবে, আপনি সমস্ত উত্তরপুরূষ চাই।

সম্পাদনা করুন: নিক হিসাবে নির্দিষ্ট, তার মাঝে একটি সূক্ষ্ম পার্থক্য $("#panel input")এবং$("#panel :input)

প্রথম এক শুধুমাত্র টাইপ ইনপুট, যে উপাদান উদ্ধার করবে <input type="...">, কিন্তু না <textarea>, <button>এবং <select>উপাদান। ধন্যবাদ নিক, এটি নিজেই জানতেন না এবং সেই অনুযায়ী আমার পোস্টটি সংশোধন করেছিলেন। উভয় বিকল্প বাম, কারণ আমি অনুমান করি যে ওপি ও সে সম্পর্কে অবগত ছিল না এবং প্রযুক্তিগতভাবে - ইনপুটগুলির জন্য জিজ্ঞাসা করেছিল ... :-)


সুতরাং,: ইনপুট সমস্ত ইনপুট / নির্বাচন / পাঠ্য ক্ষেত্র নির্বাচন করবে? একেবারে?
ইউরি

মূলত, হ্যাঁ নির্বাচক ম্যাচগুলির একটি অ্যারে ফেরত দেয়, তাই আমি অনুমান করি আপনি এটি বলতে পারেন এটি 'একবারে' হয়ে গেছে, যদিও আপনি এর অর্থ কী তা আমি পুরোপুরি নিশ্চিত নই ...
mnemosyn

1
আমি বলতে চাইছি, কেবলমাত্র সেই নির্বাচকটির সাথে "সমস্ত একসাথে"। ": ইনপুট নির্বাচনকারী বর্ণনা: সমস্ত ইনপুট, টেক্সারিয়া, নির্বাচন করুন এবং বোতামের উপাদান নির্বাচন করে" " এটি সম্পর্কে জানতাম না, আমি এখন থেকে এটি ব্যবহার করব :)
ইউরি

50

'ফাইন্ড' পদ্ধতিটি এমন একটি পাত্রে সমস্ত বাচ্চার ইনপুট পেতে ব্যবহার করা যেতে পারে যা ইতিমধ্যে এটি পুনরুদ্ধার করার জন্য সংরক্ষণ করা হয়েছে (যেখানে 'শিশুদের পদ্ধতিটি কেবলমাত্র তাত্ক্ষণিক শিশুদের পেতে পারে)। যেমন

var panel= $("#panel");
var inputs = panel.find("input");

5
এটি আমার জন্য উপযুক্ত ছিল - আমি .each () ব্যবহার করে এমন উপাদানগুলি লুপিং করছি যার অর্থ লুপের মধ্যে আমি $ (এটি) ব্যবহার করে বর্তমান উপাদানটিতে অ্যাক্সেস করছি। ফলস্বরূপ, উত্তরগুলিতে যা প্রস্তাবিত হয়েছিল আমি তা প্রচুর করতে পারছি না। - পরিবর্তে আমি do (এটি) .ফাইন্ড ("ইনপুট") করতে সক্ষম; ধন্যবাদ।
ডিজেবিপি

29

আপনি যদি রেল অন স্পিল বা স্প্রিং এমভিসি এর মতো কাঠামো ব্যবহার করেন তবে আপনাকে স্কোয়ার ব্রেস বা অন্যান্য অক্ষর সহ ডিভ ব্যবহার করতে হবে, যা আপনি ব্যবহার করতে পারবেন না document.getElementByIdএবং যদি একই ধরণের একাধিক ইনপুট থাকে তবে এই সমাধানটি এখনও কাজ করে।

var div = document.getElementById(divID);
$(div).find('input:text, input:password, input:file, select, textarea')
        .each(function() {
            $(this).val('');
        });
$(div).find('input:radio, input:checkbox').each(function() {
    $(this).removeAttr('checked');
    $(this).removeAttr('selected');
});

এই উদাহরণগুলি ইনপুটগুলি কীভাবে সাফ করবেন তা দেখায়, উদাহরণস্বরূপ আপনাকে এটিকে পরিবর্তন করতে হবে।


9
var i = $("#panel input");

কাজ করা উচিত :-)

the> কেবল প্রত্যক্ষ বাচ্চাদের বাচ্চাদের বাচ্চাদের আনবে
: সিউডো-ক্লাস ব্যবহারের জন্য, যেমন। : হোভার ইত্যাদি

সিউডো-ক্লাসের উপলভ্য সিএসএস-নির্বাচকদের সম্পর্কে আপনি এখানে পড়তে পারেন: http://docs.jquery.com/DOM/Traversing/Selectors#CSS_Selectors


6
@ শেঞ্চম্যান - :inputপাশাপাশি একজন নির্বাচকও, api.jquery.com/category/selectors/form-selectors যদি তার একটি <textarea>বা বোতাম inputনা থাকে তবে এটি খুঁজে :inputপেত so
নিক Craver

+1, সুতরাং বাইরে চলে যাওয়া> কৌশলটি করবে। এখন আমি এটি প্রস্তাবিত পৃষ্ঠায়ও পেয়েছি ....
ফিল রাইকফ

9

এখানে আমার পদ্ধতির:

আপনি এটি অন্য ইভেন্টে ব্যবহার করতে পারেন।

var id;
$("#panel :input").each(function(e){	
  id = this.id;
  // show id 
  console.log("#"+id);
  // show input value 
  console.log(this.value);
  // disable input if you want
  //$("#"+id).prop('disabled', true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="panel">
  <table>
    <tr>
       <td><input id="Search_NazovProjektu" type="text" value="Naz Val" /></td>
    </tr>
    <tr>
       <td><input id="Search_Popis" type="text" value="Po Val" /></td>
    </tr>
  </table>
</div>

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.