কিভাবে jquery ব্যবহার করে ইনপুট টাইপ পাবেন?

147

আমার একটি পৃষ্ঠা রয়েছে যেখানে ইনপুট টাইপ সর্বদা পরিবর্তিত হয় এবং ইনপুট ধরণের উপর নির্ভর করে আমার মানগুলি নেওয়া দরকার। সুতরাং যদি টাইপটি কোনও রেডিও হয় তবে আমার যা যাচাই করা দরকার তা পাওয়া দরকার এবং এটি যদি একটি চেকবক্স হয় তবে এখন যা যাচাই করা দরকার তা যদি আমার দরকার হয় এবং যদি এটি একটি ড্রপ ডাউন হয় তবে আমার জানা উচিত কোনটি নির্বাচিত এবং আমি যদি তা একটি টেক্সট / টেক্সারি আমার মান জানতে হবে।

কিভাবে এটি সম্পর্কে কোন ধারণা?

jquery input types

— luci
সূত্র

2

আপনি সবাই ইনপুট আইডি উপর নির্ভর করে আছেন, কিন্তু রেডিও বা চেক বাক্সের ক্ষেত্রে, আমার কি একই আইডি থাকার কথা? আইডিটি অবশ্যই অনন্য হতে হবে তা জেনে।

— লুসি

270

1 ফেব্রুয়ারী, 2013 সম্পাদনা করুন। এই উত্তরের জনপ্রিয়তা এবং বৈশিষ্ট্য এবং বৈশিষ্ট্য সম্পর্কিত সংস্করণ 1.9 (এবং 2.0)-তে jQuery এ পরিবর্তনের কারণে আমি ইনপুটটিতে বৈশিষ্ট্য / বৈশিষ্ট্য অ্যাক্সেস করার সময় এটি কীভাবে কাজ করে তা দেখতে কয়েকটি নোট এবং একটি ফিডাল যুক্ত করেছি, বোতাম এবং কিছু নির্বাচন। কোলাহলটি এখানে: http://jsfiddle.net/pVBU8/1/

সমস্ত ইনপুট পান:

var allInputs = $(":input");

সমস্ত ইনপুট টাইপ পান:

allInputs.attr('type');

মান পেতে:

allInputs.val();

দ্রষ্টব্য: .val () এর মতো নয়: যেখানে প্রাসঙ্গিক সেই ধরণের জন্য এটি পরীক্ষা করা হয়। ব্যবহার করুন:

.attr("checked");

1 ফেব্রুয়ারী, 2013 সম্পাদনা করুন - পুনরায়: jQuery 1.9 প্রপ (ব্যবহার না করে অ্যাটার () ব্যবহার করুন যেমন অ্যাটর পরিবর্তিত বৈশিষ্ট্যের জন্য যথাযথ মান প্রদান করবে না।

.prop('checked');

বা সহজভাবে

$(this).checked;

চেকটির মান পেতে - বর্তমানে তা যাই হোক না কেন। বা কেবলমাত্র ': চেকড' ব্যবহার করুন যদি আপনি কেবল যাচাই করে থাকেন তাদের চান।

সম্পাদনা: টাইপ করার আরও একটি উপায় এখানে:

var allCheckboxes=$('[type=checkbox]');

সম্পাদনা 2: ফর্মটি নোট করুন:

$('input:radio');

পারফর্ম করা হয়েছে

$(':radio');

যা উভয়ই সমান:

$('input[type=radio]');

তবে "ইনপুট" পছন্দসই তাই এটি কেবল ইনপুটগুলি পায় এবং সর্বজনীন '* "ব্যবহার করে না যখন রূপটি $(':radio')ব্যবহার করা হয় যা সমান$('*:radio');

19 আগস্ট, 2015 সম্পাদনা করুন: এর জন্য অগ্রাধিকারটি ব্যবহার করা $('input[type=radio]');উচিত যা আধুনিক ব্রাউজারগুলিকে একটি রেডিও ইনপুট অনুসন্ধানের জন্য অনুকূলিত করতে দেয়।

সম্পাদনা ফেব্রুয়ারী 1 ফেব্রুয়ারী, 2013 প্রতি মন্তব্য পুনরায়: উপাদানগুলি @ ডারিওম্যাক নির্বাচন করুন

$('select').prop("type");

"একাধিক" বৈশিষ্ট্য এবং উপর নির্ভর করে হয় "সিলেক্ট-ওয়ান" বা "সিলেক্ট-মাল্টিপল" ফেরত আসবে

$('select')[0].type

এটি উপস্থিত থাকলে প্রথম নির্বাচনের জন্য একইটি প্রদান করে। এবং

($('select')[0]?$('select')[0].type:"howdy")

টাইপটি উপস্থিত থাকলে অথবা "কীভাবে" তা না থাকলে তা ফিরিয়ে দেবে।

 $('select').prop('type');

DOM এর মধ্যে প্রথমটির সম্পত্তি উপস্থিত থাকলে বা যদি না থাকে তবে "অপরিজ্ঞাত" প্রদান করে।

$('select').type

এটি উপস্থিত থাকলে প্রথমটির প্রকার বা যদি না উপস্থিত থাকে তবে একটি ত্রুটি প্রদান করে।

— মার্ক শুলথেইস
সূত্র

আমি এটি চেষ্টা করেছি: var টাইপ = $ (": ইনপুট [নাম =" + নাম + "]") attআর্টর ('টাইপ'); এবং এটা কাজ করে! ধন্যবাদ।

— লুসি

2

এবং "ড্রপডাউন" বা ইনপুট নির্বাচন করুন ...? কারণ এটি কোনও ইনপুট ট্যাগ নয় ... আমার এখন একই সমস্যা আছে তবে আমি টাইপ ডোম সম্পত্তি ব্যবহার করার চিন্তা করছি ...

— ডারিওম্যাক

allInputs.attr('type');কেবলমাত্র প্রথম উপাদানগুলির ইনপুট টাইপ পাবেন। allInputs[0].attr('type');সংগ্রহে যদি একাধিক উপাদান থাকে। একই বিষয়টি allInputs.val();যদি আপনি প্রতিটি উপাদানটির ধরণ বা মান দিয়ে কিছু করতে চান তবে আপনাকে কিছু করতে হবেallInputs.each(function(){ var type = $(this).attr('type'); var val = $(this).val() });

— অ্যান্ডিফেস

এলওএল যে ফিডল তার তারিখ অনুসারে 82 টি সংশোধনী নিয়ে নিজস্ব জীবন নিয়েছে। jsfiddle.net/pVBU8/82

— মার্ক

15

আপনি নিম্নলিখিত করতে পারেন:

var inputType = $('#inputid').attr('type');

— xil3
সূত্র

এর অর্থ কি আমাকে প্রতিটি রেডিও দিতে হবে / একই আইডি চেক করতে হবে?

— লুসি

6

@zeina - কখনো উপাদান একই আইডি দেব।

— ব্যবহারকারী 113716

@ প্যাট্রিক- আমি জানি যে আইডিগুলি অবশ্যই অনন্য হবে, তবুও তারা আইডি দ্বারা ইনপুট টাইপ পাওয়ার পরামর্শ দিচ্ছে, এবং আমার রেডিও এবং চেক বাক্স থাকতে পারে যাতে আমি তাদের নামের উপর নির্ভর করব ?!

— লুসি

1

না আপনি তাদের একই আইডি দিতে পারবেন না, এটি বৈধ নয়। আপনি ব্যবহার করতে পারেন: ইনপুট jQuery নির্বাচনকারী

— মার্ক সুলথিস

9

যদি আপনি যা বলছেন তা যদি আপনি এমন কোনও ফর্মের ভিতরে সমস্ত ইনপুট পেতে চান যা ইনপুট ধরণের বিষয়ে চিন্তা না করেই একটি মান থাকে তবে এটি চেষ্টা করে দেখুন:

উদাহরণ: http://jsfiddle.net/nfLfa/

var $inputs = $('form').find(':checked,:selected,:text,textarea').filter(function() {
    return $.trim( this.value ) != '';
});

এখন আপনার কিছু ইনপুট উপাদানগুলির একটি সেট থাকা উচিত।

আপনি মানগুলিকে একটি অ্যারেতে রাখতে পারেন:

var array = $inputs.map(function(){
    return this.value;
}).get();

অথবা আপনি সেগুলি সিরিয়ালায়িত করতে পারেন:

var serialized = $inputs.serialize();

— user113716
সূত্র

7

GetValue = function(id) {
  var tag = this.tagName;
  var type = this.attr("type");

  if (tag == "input" && (type == "checkbox" || type == "radio"))
    return this.is(":checked");

  return this.val();
};

— ম্যাথু অ্যাবট
সূত্র

4

$("#yourobj").attr('type');

— Ergec
সূত্র

4

সন্ধান শুরু করার জন্য সেরা জায়গা http://api.jquery.com/category/selectors/

এটি আপনাকে উদাহরণগুলির একটি ভাল সেট দেবে।

আলটামতভাবে ডিওএম-তে উপাদান নির্বাচন করা সিএসএস নির্বাচক ব্যবহার করে করা হয় তাই আপনি যদি আইডির মাধ্যমে কোনও উপাদান পাওয়ার কথা ভাবেন আপনি $ ('# এলিমেন্টআইডি') ব্যবহার করতে চান, যদি আপনি সমস্ত ইনপুট ট্যাগগুলি $ ('ইনপুট') ব্যবহার করতে চান এবং আপনি যে অংশটি চেকবক্সের ধরণের ব্যবহার করে want ('ইনপুট, [টাইপ = চেকবক্স]) ব্যবহার করতে চান তা যদি আপনি চান তবে আপনি যে অংশটি চান তা শেষ করে দেবেন

দ্রষ্টব্য: আপনি যে মানগুলি চান তা সর্বাধিক বৈশিষ্ট্যগুলিতে পাওয়া যায় তাই বৈশিষ্ট্যের জন্য সিএসএস নির্বাচক হ'ল: [গুণবাচক নাম = মান]

আপনি একটি তালিকা বাক্সে আপত্তি হিসাবে ড্রপডাউন চেয়েছিলেন কেবল কারণ নিম্নলিখিত চেষ্টা করুন:


$('select, [size]).each(function(){
  var selectedItem = $('select, [select]', this).first();
});

কোডটি মেমোরি থেকে ছিল তাই দয়া করে ছোট ত্রুটির জন্য প্রশংসিত হন

— রবার্ট
সূত্র

এখানে '[আকার]' বলতে কী বোঝায়?

— অচেনা

@ উদয়কুমার '[আকার]' ফলাফলগুলিকে কেবল আকারের বৈশিষ্ট্যযুক্ত নির্বাচিত উপাদানগুলিকে অন্তর্ভুক্ত করতে ফলাফলগুলি ফিল্টার করবে সুতরাং কেবলমাত্র তালিকা বাক্সগুলি নির্বাচিত হবে এবং ড্রপ ডাউনগুলি নয়।

— রবার্ট

তালিকা বাক্স -> আপনি কি পাঠ্য বাক্স বোঝাতে চান?

— অপরিচিত

1

@ উদয়াকুমার, না মানে তালিকার বাক্স, একটি ড্রপ ডাউন এবং একটি তালিকা বাক্সের মধ্যে পার্থক্য দেখতে এই লিঙ্কটি [ jsfiddle.net/565961fj ] অনুসরণ করুন ।

— রবার্ট

3

var val = $('input:checkbox:checked, input:radio:checked, \
   select option:selected, textarea, input:text',
   $('#container')).val();

মন্তব্যসমূহ:

আমি ধরে নিলাম, ঠিক একটি ফর্ম উপাদান রয়েছে, তা হয় টেক্সারিয়া, ইনপুট ক্ষেত্র, ফর্ম নির্বাচন করুন, রেডিও বোতামগুলির একটি সেট বা একক চেকবক্স (আপনার আরও চেকবক্স প্রয়োজন হলে আপনাকে আমার কোড আপডেট করতে হবে)।
আইডি container(পৃষ্ঠার অন্যান্য উপাদানগুলির সাথে অস্পষ্টতা অপসারণের জন্য ) উপাদানের ভিতরে প্রশ্নের মধ্যে থাকা উপাদানটি থাকে ।
কোডটি তারপরে পাওয়া প্রথম মিলে যাওয়া উপাদানটির মান ফিরিয়ে দেবে । যেহেতু আমি :checkedএবং ব্যবহার করি তাই এটি সর্বদা আপনার সন্ধানের মূল্য হতে হবে।

— Boldewyn
সূত্র

3

দেখে মনে হবে অ্যাটর কার্যকারিতা আরও অবচিত হয়ে চলেছে

$(this).attr('TYPE')
undefined
$(this).prop('type')
"text"

— প্যাট কপোজি
সূত্র

0

আমার অ্যাপ্লিকেশনটিতে আমি একই আইডি (খারাপ) থাকা দুটি ভিন্ন উপাদান দিয়ে শেষ করেছি। একটি উপাদান ছিল একটি ডিভ এবং অন্যটি একটি ইনপুট। আমি আমার ইনপুটগুলি যোগ করার চেষ্টা করছিলাম এবং সদৃশ আইডিগুলি বুঝতে আমাকে কিছুটা সময় নিয়েছিল। # টির সামনে আমি যে উপাদানটি চেয়েছিলাম তার ধরণটি রেখে, আমি ইনপুট উপাদানটির মান ধরে নিতে এবং বিভাগটি বাতিল করতে সক্ষম হয়েছি:

$("input#_myelementid").val();

আমি আসা করি এটা সাহায্য করবে.

— ত্বীবী
সূত্র

0

<!DOCTYPE html>
<html>

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
          $(".show-pwd").click(function(){
          alert();
            var x = $("#myInput");
            if (x[0].type === "password") {
              x[0].type = "text";
            } else {
              x[0].type = "password";
            }
          });
        });
    </script>
</head>

<body>
    <p>Click the radio button to toggle between password visibility:</p>Password:
    <input type="password" value="FakePSW" id="myInput">
    <br>
    <br>
    <input type="checkbox" class="show-pwd">Show Password</body>

</html>

— অমিত দ্বিবেদী
সূত্র

0

  <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="ie=edge">
        <script type="text/javascript" src="hs/jquery1.js"></script>
        <title>Document</title>
    </head>
    <body>
        <form>
            <input type="text" class="tamil">
            <input type="button" class="english">
        </form>
        <script>
            $("input").addClass(function(index){
                    console.log($(this).attr('type'));
            })
        </script>
    </body>
    </html>

আমি রাইট ফর্ম টাইপ পেতে

— সন্তোষ কুমার
সূত্র