আপনি যখন পাঠ্যবক্সে এন্টার টিপুন তখন এইচটিএমএল বোতামটি কীভাবে ট্রিগার করবেন?

Question

আমার এখন পর্যন্ত কোডটি হ'ল:

<fieldset id="LinkList">
    <input type="text" id="addLinks" name="addLinks" value="http://">
    <input type="button" id="linkadd" name="linkadd" value="add">
</fieldset>

এটি একটিতে হয় না <form>এবং এটি যেমন এটি হয় তেমন হয় <div>। যাইহোক আমি যখন textbox"অ্যাডলিংকস" নামে কিছু টাইপ করি তখন আমি চাই যে ব্যবহারকারী এন্টার টিপুন এবং "লিঙ্কএডিডি" ট্রিগার করতে সক্ষম buttonহবে যা একটি জাভাস্ক্রিপ্ট ফাংশন চালাবে।
কিভাবে আমি এটি করতে পারব?
ধন্যবাদ

সম্পাদনা করুন: আমি এই কোডটি পেয়েছি তবে এটি কাজ করে বলে মনে হচ্ছে না।

$("#addLinks").keyup(function(event){
    if(event.keyCode == 13){
        $("#linkadd").click();
    }
});

Comments

বাঁধুন keypressএবং চেক করুন e.charCode==13(বোতামে প্রবেশ করুন)।

— ব্র্যাড ক্রিস্টি

আপনি কি উপরের কোডটি ব্যবহার করার আগে jquery লাইব্রেরি রেফারেন্স যুক্ত করেছেন?

— মিলিন্দ অনন্ত্বর

হ্যাঁ আমি লাইব্রেরিটি উল্লেখ করেছি, কেন এটি কাজ করছে না তা নিশ্চিত নই, তবে এখন এটি ঠিক আছে। ধন্যবাদ

— বেন

হ্যাঁ, @ ব্র্যাডক্রিশি যেমন উল্লেখ করেছেন keypressবা এই উত্তরেkeydown উল্লেখ করেছেন সেভাবে চলার উপায়।

— 9'15

Answer 1

$(document).ready(function(){
    $('#TextBoxId').keypress(function(e){
      if(e.keyCode==13)
      $('#linkadd').click();
    });
});

Comments

ক্লিক ইভেন্টের পরে 'রিটার্ন মিথ্যা' যুক্ত করাও সহায়ক, পৃষ্ঠার অন্যান্য বোতামগুলিতে একটি ডিফল্ট এন্টার টিপতে এড়াতে

— 19: 45-এ

দিমিত্রি_রোমানভের উত্তর আরও ভাল কারণ এটি খাঁটি এইচটিএমএল।

— ম্যাককে

@ এমসিকে, না তা নয়। ফর্মগুলি ছাড়াও বোতামগুলি ব্যবহার করা যেতে পারে। আসলে, ওপির প্রশ্নটি কোনও ফর্মের মধ্যে স্পষ্টভাবে নয়।

— ড্যান

@ ডেবিস বেশ ঠিক বলেছেন, সেদিন আমি কী করেছি তা নিশ্চিত নন তবে আমার অবশ্যই মস্তিষ্কের অল্প দূরত্ব ছিল

— টিম মাস্টার্সএলেনে

সতর্কতা এটি বর্তমানে হ্রাস করা হয়েছে ।

— Константин Ван

Answer 2

এটি .......2020. এবং আমি বিশ্বাস করি এটি এখনও সত্য holds

---

ব্যবহার করবেন না keypress

1. keypressঘটনা আলোড়ন সৃষ্টি না তখন ব্যবহারকারী presses একটি কী যে কোনো চরিত্র উত্পাদন না যেমন Tab, Caps Lock, Delete, Backspace, Escape, বাম ও ডান Shift, ফাংশন কি-সংকলন ( F1- F12)।

   keypressইভেন্ট _{মজিলা বিকাশকারী নেটওয়ার্ক}

   keypressযখন একটি কী ঘটনা বহিস্কার করা হয় নিচে চাপা হয় , এবং যে কী স্বাভাবিকভাবে একটি অক্ষর মান উৎপন্ন । inputপরিবর্তে ব্যবহার করুন।

2. এটি হ্রাস করা হয়েছে।

   keypressইভেন্ট _{ইউআই ইভেন্টস (ডাব্লু 3 সি ওয়ার্কিং ড্রাফট 8 নভেম্বর, 2018 প্রকাশিত হয়েছে)}

   • দ্রষ্টব্য | keypressঘটনা ঐতিহ্যগতভাবে সঙ্গে যুক্ত করা হয় একটি সনাক্ত চরিত্র মান একটি শারীরিক কী বদলে , এবং কিছু কনফিগারেশনের সমস্ত নির্দেশক উপলব্ধ নাও হতে পারে।
   • সতর্কতা | keypressঘটনা টাইপ রেফারেন্স এবং সম্পূর্ণতার জন্য এই স্পেসিফিকেশন সংজ্ঞায়িত করা হয়, কিন্তু এই স্পেসিফিকেশন deprecates এই ইভেন্টটি ধরনের ব্যবহার। প্রসঙ্গ সম্পাদনা করার সময়, লেখকরা beforeinputপরিবর্তে ইভেন্টটির সদস্যতা নিতে পারেন ।

---

ব্যবহার করবেন না KeyboardEvent.keyCode

1. এটি হ্রাস করা হয়েছে।

   KeyboardEvent.keyCode _{মজিলা বিকাশকারী নেটওয়ার্ক}

   অবমানিত | এই বৈশিষ্ট্যটি আর সুপারিশ করা হয় না। যদিও কিছু ব্রাউজার এখনও এটি সমর্থন করতে পারে তবে এটি ইতিমধ্যে প্রাসঙ্গিক ওয়েব স্ট্যান্ডার্ড থেকে সরিয়ে ফেলা হতে পারে, ফেলে দেওয়া প্রক্রিয়াধীন হতে পারে, বা কেবলমাত্র সামঞ্জস্যের উদ্দেশ্যে রাখা যেতে পারে। এটি ব্যবহার করা এড়িয়ে চলুন এবং সম্ভব হলে বিদ্যমান কোড আপডেট করুন; আপনার সিদ্ধান্তটি গাইড করতে এই পৃষ্ঠার নীচে সামঞ্জস্যতা সারণীটি দেখুন । সচেতন হন যে এই বৈশিষ্ট্যটি যে কোনও সময় কাজ করা বন্ধ করতে পারে।

---

আমার তখন কী ব্যবহার করা উচিত? (ভাল অনুশীলন)

// Make sure this code gets executed after the DOM is loaded.
document.querySelector("#addLinks").addEventListener("keyup", event => {
    if(event.key !== "Enter") return; // Use `.key` instead.
    document.querySelector("#linkadd").click(); // Things you want to do.
    event.preventDefault(); // No need to `return false;`.
});

Comments

কিভাবে সম্পর্কে: if (event.key == "Enter") { document.querySelector("#linkadd").click(); } ?

— অনুপম

নোট যেটি .keyসমস্ত ব্রাউজারগুলিতে সমর্থিত নয়: caniuse.com/#feat=keyboardevent-key - প্রায় 10% লোক ব্রাউজার ব্যবহার করে যা এটি সমর্থন করে না।

— মার্টিন টর্নয়েজ

Answer 3

একটি জেএস-মুক্ত সমাধান রয়েছে।

সেট type=submitবোতামটি আপনাকে ডিফল্ট এবং হতে চান সেই ভাষাতে type=buttonঅন্যান্য বোতাম করতে। এখন নীচের ফর্মটিতে আপনি যে কোনও ইনপুট ক্ষেত্র এবং এন্টার টিপুনRender বোতামটি কাজ করবে (এটি ফর্মের দ্বিতীয় বোতাম সত্ত্বেও)।

উদাহরণ:

    <button id='close_renderer_button' class='btn btn-success'
            title='Перейти к редактированию программы'
            type=button>
      <span class='glyphicon glyphicon-edit'> </span> Edit program
    </button>
    <button id='render_button' class='btn btn-primary'
            title='Построить фрактал'
            type=submit
            formaction='javascript:alert("Bingo!");'>
      <span class='glyphicon glyphicon-send'> </span> Render
    </button>

এফএফ 24 এবং ক্রোম 35-তে পরীক্ষিত ( formactionএটি এইচটিএমএল 5 বৈশিষ্ট্যযুক্ত, তবে typeতা নয়)।

Comments

কেবলমাত্র যদি আপনি কোনও ফর্মের মধ্যে থাকেন তবেই কাজ করে, ওপি কোনও ফর্ম ব্যবহার করে না

— অ্যান্ড্রু

@ অ্যান্ড্রু হ্যাঁ, আমি এটি মিস করেছি। এখন আমি এটি স্পষ্ট দেখতে পাচ্ছি, ধন্যবাদ।

— দিমিত্রি_রোমানভ

@ অ্যান্ড্রু, সত্য, তবে এটি বেশিরভাগ ক্ষেত্রে একে কিছু করার মতো আকারে জড়ানোর বিষয়টি তুচ্ছ ...

— স্টিফেন চুং

অতিরিক্তভাবে এই সমাধানটি আইওএস ভার্চুয়াল কীবোর্ড [গো] বোতামে কাজ করে যার ডিফল্ট ক্রিয়া জমা দেওয়া হবে।

— প্রাথমিক

Answer 4

1. এর buttonসাথে প্রতিস্থাপন করুনsubmit
2. প্রগতিশীল হও , আপনার একটি সার্ভার সাইড সংস্করণ রয়েছে তা নিশ্চিত করুন
3. আপনার জাভাস্ক্রিপ্টটি submitফর্মের হ্যান্ডলারের সাথে আবদ্ধ করুন , clickবোতামটির হ্যান্ডলারটি নয়

ক্ষেত্রের মধ্যে প্রবেশ টিপুন ফর্ম জমা দেওয়ার ট্রিগার করবে, এবং জমা দেওয়া হ্যান্ডলারটি আগুন জ্বালিয়ে দেবে।

Answer 5

আপনি নিজের ইনপুটটিতে ইভেন্ট হ্যান্ডলারটি যুক্ত করতে পারেন:

document.getElementById('addLinks').onkeypress=function(e){
    if(e.keyCode==13){
        document.getElementById('linkadd').click();
    }
}

Answer 6

এটি কাজ করে যখন ইনপুট টাইপ = "বোতাম" কে ডিফল্ট বোতামটির জন্য ইনপুট টাইপ = "জমা" দিয়ে প্রতিস্থাপন করা হয় যা ট্রিগার করা দরকার।

Answer 7

প্রথমে jquery লাইব্রেরি ফাইল jquery যুক্ত করুন এবং এটি আপনার এইচটিএমএল মাথায় কল করুন।

এবং তারপরে jquery ভিত্তিক কোড ব্যবহার করুন ...

$("#id_of_textbox").keyup(function(event){
    if(event.keyCode == 13){
        $("#id_of_button").click();
    }
});

Answer 8

এটি করা উচিত, আমি jQuery ব্যবহার করছি আপনি সাধারণ জাভাস্ক্রিপ্ট লিখতে পারেন। আপনার কার্যকারিতা দিয়ে
প্রতিস্থাপন করুন sendMessage()।

$('#addLinks').keypress(function(e) {
    if (e.which == 13) {
        sendMessage();
        e.preventDefault();
    }
});

Answer 9

পূর্ববর্তী কয়েকটি উত্তরের ভিত্তিতে আমি এটি নিয়ে এসেছি:

<form>
  <button id='but' type='submit'>do not click me</button>
  <input type='text' placeholder='press enter'>
</form>

$('#but').click(function(e) {
  alert('button press');
  e.preventDefault();
});

ফিডল একবার দেখুন

সম্পাদনা: আপনি যদি অতিরিক্ত এইচটিএমএল উপাদান যুক্ত করতে না চান তবে আপনি কেবল জেএস দিয়ে এটি করতে পারেন:

    $("input").keyup(function(event) {
        if (event.keyCode === 13) {
            $("button").click();
        }
    });     

Answer 10

আমি w3schools.com কীভাবে পেয়েছি, তাদের চেষ্টা করার পৃষ্ঠাটি নীচে রয়েছে।

https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_trigger_button_enter

এটি আমার নিয়মিত ব্রাউজারে কাজ করেছে তবে আমার পিএইচপি অ্যাপ্লিকেশনটিতে কাজ করে না যা বিল্ট ইন পিএইচপি ব্রাউজার ব্যবহার করে।

কিছুটা টোয় করার পরে আমি নীচের খাঁটি জাভাস্ক্রিপ্ট বিকল্পটি নিয়ে এসেছি যা আমার পরিস্থিতির জন্য কাজ করে এবং প্রতিটি অন্যান্য পরিস্থিতিতে কাজ করা উচিত:

    function checkForEnterKey(){
        if (event.keyCode === 13) {
            event.preventDefault();
            document.getElementById("myBtn").click();
        }
    }

    function buttonClickEvent()
    {
        alert('The button has been clicked!');
    }

এইচটিএমএল বোতামটি সক্রিয় করতে পাঠ্যবাক্সের ভিতরে প্রবেশ কী টিপুন।

    <br />
    <input id="myInput" onkeyup="checkForEnterKey(this.value)">
    <br />
    <button id="myBtn" onclick="buttonClickEvent()">Button</button>

Answer 11

<input type="text" id="input_id" />    

$('#input_id').keydown(function (event) {
    if (event.keyCode == 13) { 
         // Call your function here or add code here
    }
});

Answer 12

আমি একটি কেন্দো বোতাম ব্যবহার করছি। এটি আমার পক্ষে কাজ করেছে।

<div class="form-group" id="indexform">
    <div class="col-md-8">
            <div class="row">
                <b>Search By Customer Name/ Customer Number:</b>
                @Html.TextBox("txtSearchString", null, new { style = "width:400px" , autofocus = "autofocus" })
                @(Html.Kendo().Button()
                    .Name("btnSearch")
                    .HtmlAttributes(new { type = "button", @class = "k-primary" })
                    .Content("Search")
                    .Events(ev => ev.Click("onClick")))
            </div>
    </div>
</div>
<script>
var validator = $("#indexform").kendoValidator().data("kendoValidator"),
          status = $(".status");
$("#indexform").keyup(function (event) {
    if (event.keyCode == 13) {
        $("#btnSearch").click();
    }
});
</script>