আমি জানতে চাই যে নির্দিষ্ট ফর্মের জন্য ক্রোম অটোফিল বৈশিষ্ট্যটি সক্ষম করার জন্য কোনও ধরণের বিশেষ মার্কআপ রয়েছে কিনা। এটি কেবলমাত্র কীভাবে অক্ষম করা যায় সে সম্পর্কে আমি কেবল প্রশ্নগুলি পেয়েছি, তবে আমি জানতে চাই যে এইচটিএমএল কোডটিতে আমি কোনও ধরণের মার্কআপ যুক্ত করতে পারি কিনা ব্রাউজারকে বলতে "এটি ঠিকানার ইনপুট" বা "এটি জিপ কোড ফিল্ড "এটিকে সঠিকভাবে পূরণ করতে (ধরে নিলেন ব্যবহারকারী এই বৈশিষ্ট্যটি সক্রিয় করেছেন)।
উত্তর:
২০১ 2017 সালের আপডেট করুন: দেখে মনে হচ্ছে কেটির উত্তরটির চেয়ে আমার থেকে বেশি আধুনিক তথ্য রয়েছে। ভবিষ্যতের পাঠকগণ: তার উত্তরে আপনার ভোট দিন ।
এটি একটি দুর্দান্ত প্রশ্ন এবং একটি যার জন্য ডকুমেন্টেশনগুলি আশ্চর্যজনকভাবে আসা শক্ত। আসলে, অনেক ক্ষেত্রে আপনি দেখতে পাবেন যে ক্রোম অটোফিল কার্যকারিতা "স্রেফ কাজ করে"। উদাহরণস্বরূপ, এইচটিএমএলের নীচের স্নিপেট একটি ফর্ম তৈরি করে যা কমপক্ষে আমার জন্য (ক্রোম বনাম 18), প্রথম ক্ষেত্রে ক্লিক করার পরে স্বয়ংক্রিয়ভাবে পূরণ করা হয়:
<!DOCTYPE html>
<html>
<body>
<form method="post">
First name:<input type="text" name="fname" /><br />
Last name: <input type="text" name="lname" /><br />
E-mail: <input type="text" name="email" /><br />
Phone: <input type="text" name="phone" /><br />
Address: <input type="text" name="address" /><br />
</form>
</body>
</html>যাইহোক, এই উত্তরটি অসন্তুষ্টিজনক, কারণ এটি "ম্যাজিক" এর রাজ্যে সমাধানটি ফেলে দেয়। আরও গভীর খনন করে আমি শিখেছি যে ক্রম (এবং অন্যান্য স্বতঃপূরণ-সক্ষম ব্রাউজারগুলি) ফর্ম উপাদানগুলিতে পূরণ করা উচিত এমন ডেটার ধরণ নির্ধারণ করতে প্রাথমিকভাবে প্রাসঙ্গিক ক্লুগুলির উপর নির্ভর করে। এই জাতীয় প্রাসঙ্গিক ক্লুগুলির উদাহরণগুলির মধ্যে nameএকটি ইনপুট উপাদান, উপাদানটিকে ঘিরে থাকা পাঠ্য এবং কোনও স্থানধারক পাঠ্য অন্তর্ভুক্ত।
তবে সম্প্রতি, ক্রোম দল স্বীকার করেছে যে এটি একটি অসন্তুষ্টির সমাধান, এবং তারা এই বিষয়ে মানকতার জন্য চাপ দেওয়া শুরু করেছে। গুগল ওয়েবমাস্টার গোষ্ঠীর একটি খুব তথ্যমূলক পোস্ট সম্প্রতি এই বিষয়টি নিয়ে আলোচনা করেছে, ব্যাখ্যা করে:
দুর্ভাগ্যক্রমে, এখন পর্যন্ত ওয়েবমাস্টারদের পক্ষে ক্রোম এবং অন্যান্য ফর্ম-ফিলিং সরবরাহকারীরা তাদের ফর্মটি সঠিকভাবে পার্স করতে পারে তা নিশ্চিত করা কঠিন হয়ে পড়েছে। কিছু মান বিদ্যমান; তবে তারা ওয়েবসাইটটি বাস্তবায়নের জন্য প্রচুর বোঝা চাপিয়ে দিয়েছিল, যাতে তারা বাস্তবে খুব বেশি ব্যবহার হয় না।
(তারা যে "মানদণ্ডগুলি উল্লেখ করে তারা হ'ল উপরের অ্যাভালানচিসের উত্তরে উল্লিখিত বর্ণনার আরও সাম্প্রতিকতম রূপ ।)
গুগল পোস্ট তাদের প্রস্তাবিত সমাধানগুলি বর্ণনা করে (যা পোস্টের মন্তব্যে উল্লেখযোগ্য সমালোচনা দ্বারা মিলিত হয়)। তারা এই উদ্দেশ্যে একটি নতুন বৈশিষ্ট্য ব্যবহার করার প্রস্তাব দেয়:
ইনপুট উপাদানটিতে কেবল একটি বৈশিষ্ট্য যুক্ত করুন, উদাহরণস্বরূপ কোনও ইমেল ঠিকানা ক্ষেত্রটি দেখতে পারে:
<input type=”text” name=”field1” x-autocompletetype=”email” />
... যেখানে x-"পরীক্ষামূলক" এর অর্থ দাঁড়ায় এবং যদি & কখন এটি একটি মান হয়ে যায় removed আরও বিশদের জন্য পোস্টটি পড়ুন , অথবা আপনি আরও গভীর খনন করতে চাইলে হোয়াইটডাব্লু উইকিতে প্রস্তাবটির আরও সম্পূর্ণ ব্যাখ্যা পাবেন ।
আপডেট:
এই অন্তর্দৃষ্টিপূর্ণ উত্তরগুলিতে নির্দেশিত হিসাবে , সাধারণ ক্ষেত্রগুলি সনাক্ত করতে / সনাক্ত করতে Chrome ব্যবহার করে এমন সমস্ত নিয়মিত প্রকাশ পাওয়া যায় autofill_regex_constants.cc.utf8। সুতরাং আসল প্রশ্নের উত্তর দেওয়ার জন্য, নিশ্চিত করুন যে এইচটিএমএল ক্ষেত্রের নামগুলি এই এক্সপ্রেশনগুলির সাথে মিলছে। কিছু উদাহরণ অন্তর্ভুক্ত:
"first.*name|initials|fname|first$""last.*name|lname|surname|last$|secondname|family.*name""e.?mail""address.*line|address1|addr1|street""zip|postal|post.*code|pcode|^1z$"এই প্রশ্নটি বেশ পুরানো তবে আমার একটি উত্তর উত্তর আছে !
স্বতঃপূরণ সক্ষম করার জন্য WHATWG ডকুমেন্টেশনের একটি লিঙ্ক এখানে।
গুগল মোবাইল অ্যাপ্লিকেশনগুলি বিকাশের জন্য একটি দুর্দান্ত সুন্দর গাইড লিখেছিল যা মোবাইল ডিভাইসের জন্য বন্ধুত্বপূর্ণ। ফর্মের ইনপুটগুলিকে কীভাবে সহজে স্বয়ংক্রিয়-ফিল ব্যবহার করতে হবে তার নাম রাখার বিষয়ে তাদের একটি বিভাগ রয়েছে। এটি মোবাইলের জন্য লেখা হলেও ঘটনাটি ডেস্কটপ এবং মোবাইল উভয়ের জন্যই প্রযোজ্য!
স্বতঃপূরণকে কীভাবে সক্ষম করবেন সে সম্পর্কে এখানে কয়েকটি মূল বিষয়:
<label>সমস্ত <input>ক্ষেত্রের জন্য একটি ব্যবহার করুনautocompleteআপনার <input>ট্যাগগুলিতে একটি বৈশিষ্ট্য যুক্ত করুন এবং এই গাইডটি ব্যবহার করে এটি পূরণ করুন ।nameএবং autocompleteসবার জন্য সঠিকভাবে বৈশিষ্ট্যাবলী <input>ট্যাগউদাহরণ :
<label for="frmNameA">Name</label>
<input type="text" name="name" id="frmNameA"
placeholder="Full name" required autocomplete="name">
<label for="frmEmailA">Email</label>
<input type="email" name="email" id="frmEmailA"
placeholder="name@example.com" required autocomplete="email">
<!-- note that "emailC" will not be autocompleted -->
<label for="frmEmailC">Confirm Email</label>
<input type="email" name="emailC" id="frmEmailC"
placeholder="name@example.com" required autocomplete="email">
<label for="frmPhoneNumA">Phone</label>
<input type="tel" name="phone" id="frmPhoneNumA"
placeholder="+1-555-555-1212" required autocomplete="tel"><input>ট্যাগ নামস্বতঃপূরণকে ট্রিগার করার জন্য, নিশ্চিত হয়ে নিন যে আপনি আপনার ট্যাগগুলিতে নাম nameএবং autocompleteবৈশিষ্ট্যগুলি সঠিকভাবে লিখেছেন <input>। এটি স্বয়ংক্রিয়ভাবে ফর্মগুলিতে স্বয়ংক্রিয়রূপে অনুমতি দেবে। একটি আছে তা নিশ্চিত করুন <label>! এই তথ্য এখানে পাওয়া যাবে ।
আপনার ইনপুটগুলির নাম কীভাবে দেওয়া যায় তা এখানে:
name:name fname mname lnameautocomplete:
name (পুরো নাম জন্য)given-name (প্রথম নামের জন্য)additional-name (মাঝের নামের জন্য)family-name (পদবি জন্য)<input type="text" name="fname" autocomplete="given-name">name:emailautocomplete:email<input type="text" name="email" autocomplete="email">name:address city region province state zip zip2 postal country autocomplete:
street-addressaddress-line1address-line2address-level1 (রাজ্য বা প্রদেশ)address-level2 (শহর)postal-code (জিপ কোড)countryname:phone mobile country-code area-code exchange suffix extautocomplete:telname:ccname cardnumber cvc ccmonth ccyear exp-date card-typeautocomplete:
cc-namecc-numbercc-csccc-exp-monthcc-exp-yearcc-expcc-typename:usernameautocomplete:usernamename:passwordautocomplete:
current-password (সাইন-ইন ফর্মগুলির জন্য)new-password (সাইন-আপ এবং পাসওয়ার্ড-পরিবর্তন ফর্মগুলির জন্য)আমার পরীক্ষা থেকে, x-autocompleteট্যাগ কিছুই করে না। পরিবর্তে autocompleteআপনার ইনপুট ট্যাগগুলিতে ট্যাগ ব্যবহার করুন এবং এখানে এইচটিএমএল অনুমান অনুসারে তাদের মানগুলি সেট করুন http://www.phawg.org/specs/web-apps/current-work/m মাল্টিপেজ / এসোসিয়েশন- অফ- নিয়ন্ত্রণগুলি- এবং- সংস্করণ। এইচটিএমএল # অটোফিল-ফিল্ড ।
উদাহরণ:
<input name="fname" autocomplete="given-name" type="text" placeholder="First Name" required>মূল ফর্ম ট্যাগটির স্বতঃপূরণ = "চালু" এবং পদ্ধতি = "পোস্ট" প্রয়োজন needs
on , offবা default। সুতরাং এটি অবৈধ মার্ক আপ এবং অসঙ্গতিগুলির প্রবণ হবে। আমি প্রকৃতপক্ষে স্ব-পরিপূর্ণ বৈশিষ্ট্যটিতে স্থান নির্ধারণ অপ্রাসঙ্গিক বলে মনে করি। আমি অনুমান করব যে এটি সমস্ত বৈশিষ্ট্যগুলি দেখায় এবং স্বতঃসম্পূর্ণ ঘটে যা এটি চেক করে তার মধ্যে একটি হয়ে যায় be
আপনাকে উপাদানগুলির যথাযথ নামকরণ করতে হবে যাতে ব্রাউজারটি সেগুলি স্বয়ংক্রিয়ভাবে পূরণ করে।
এটির জন্য আইইটিএফের অনুমান এখানে দেওয়া হয়েছে:
আমি স্রেফ স্পোকটি নিয়ে খেলেছি এবং একটি দুর্দান্ত কাজের উদাহরণ পেয়েছি - আরও কয়েকটি ক্ষেত্র সহ including
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<form autocomplete="on" method="POST">
<fieldset>
<legend>Ship the blue gift to...</legend>
<p>
<label> Firstname:
<input name="fname" autocomplete="section-blue shipping given-name" type="text" required>
</label>
</p>
<p>
<label> Lastname:
<input name="fname" autocomplete="section-blue shipping family-name" type="text" required>
</label>
</p>
<p>
<label> Address: <input name=ba
autocomplete="section-blue shipping street-address">
</label>
</p>
<p>
<label> City: <input name=bc
autocomplete="section-blue shipping address-level2">
</label>
</p>
<p>
<label> Postal Code: <input name=bp
autocomplete="section-blue shipping postal-code">
</label>
</p>
</fieldset>
<fieldset>
<legend>Ship the red gift to...</legend>
<p>
<label> Firstname:
<input name="fname" autocomplete="section-red shipping given-name" type="text" required>
</label>
</p>
<p>
<label> Lastname:
<input name="fname" autocomplete="section-red shipping family-name" type="text" required>
</label>
</p>
<p>
<label> Address: <input name=ra
autocomplete="section-red shipping street-address">
</label>
</p>
<p>
<label> City: <input name=bc
autocomplete="section-red shipping address-level2">
</label>
</p>
<p>
<label> Postal Code: <input name=rp
autocomplete="section-red shipping postal-code">
</label>
</p>
</fieldset>
<fieldset>
<legend>payment address</legend>
<p>
<label> Firstname:
<input name="fname" autocomplete="billing given-name" type="text" required>
</label>
</p>
<p>
<label> Lastname:
<input name="fname" autocomplete="billing family-name" type="text" required>
</label>
</p>
<p>
<label> Address: <input name=ra
autocomplete="billing street-address">
</label>
</p>
<p>
<label> City: <input name=bc
autocomplete="billing address-level2">
</label>
</p>
<p>
<label> Postal Code: <input name=rp
autocomplete="billing postal-code">
</label>
</p>
</fieldset>
<input type="submit" />
</form>
</body>
</html>এটিতে 2 পৃথক ঠিকানার অঞ্চল এবং ঠিকানার ধরণও রয়েছে differen এটি আইওএস 8.1.0 এও পরীক্ষিত হয়েছিল এবং মনে হয় এটি সর্বদা সমস্ত ক্ষেত্র একবারে পূরণ করে, যখন ডেস্কটপ ক্রোম অটোফিল ঠিকানার মাধ্যমে ঠিকানা।
দেখে মনে হচ্ছে আমরা এই অটোফিল বৈশিষ্ট্যটি সম্পর্কে আরও নিয়ন্ত্রণ পাব, ক্রোম ক্যানারিতে একটি নতুন পরীক্ষামূলক এপিআই আসছে যা ব্যবহারকারীর কাছে এটি জিজ্ঞাসা করার পরে ডেটা অ্যাক্সেস করতে ব্যবহার করা যেতে পারে:
http://www.chromium.org/developers/using-requestautocomplete http://blog.alexmaccaw.com/requestautocomplete
গুগল দ্বারা নতুন infos:
http://googlewebmastercentral.blogspot.de/2015/03/helping-users-fill-out-online-forms.html
এখানে এটি আসল উত্তর:
এটি কাজ করে: http://jsfiddle.net/68LsL1sq/1/ <label for="name">Nom</label>
এটি নয়: http://jsfiddle.net/68LsL1sq/2/ <label for="name">No</label>
কেবলমাত্র পার্থক্য হ'ল লেবেলটিতে। "নাম" পর্তুগিজ ভাষায় "নাম" বা "নোম" থেকে এসেছে।
সুতরাং আপনার যা প্রয়োজন তা এখানে:
<label for="id_of_field">Name</label><input id="id_of_field"></input>বেশি না.
গুগল অটোফিল "নাম" এর নতুন তালিকা এখানে। কোনও অনুমোদিত ভাষায় সমস্ত সমর্থিত নাম রয়েছে।
গুগল এখন এর জন্য ডকুমেন্টেশন সরবরাহ করে:
অটোফিল | ব্যবহারকারীদের দ্রুত চেকআউট করতে সহায়তা করুন ওয়েব | গুগল বিকাশকারী
এবং
আমার ক্ষেত্রে, $('#EmailAddress').attr('autocomplete', 'off');কাজ হয় না। তবে নিম্নলিখিতটি jQuery দ্বারা ক্রোম সংস্করণ 67 এ কাজ করে।
$('#EmailAddress').attr('autocomplete', 'new-email');
$('#Password').attr('autocomplete', 'new-password');