JQuery ব্যবহার করে স্থানধারক পাঠ্য পরিবর্তন করুন


206

আমি একটি jQuery স্থানধারক প্লাগইন ব্যবহার করছি (https://github.com/danielstocks/jQuery- স্থানধারক)। ড্রপডাউন মেনুতে পরিবর্তনের সাথে আমার স্থানধারক পাঠ্য পরিবর্তন করতে হবে। তবে পরিবর্তন হচ্ছে না। কোডটি এখানে:

$(function () {
    $('input[placeholder], textarea[placeholder]').placeholder();
    $('#serMemdd').change(function () {
        var k = $(this).val();
        if (k == 1) {
            $("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").placeholder();
        }
        else if (k == 2) {
            $("#serMemtb").attr("placeholder", "Type an ID").placeholder();
        }
        else if (k == 3) {
            $("#serMemtb").attr("placeholder", "Type a Location").placeholder();
        }
    });
});

আমার এইচটিএমএল:

<div class="filterbox">
        <select name="ddselect" id="serMemdd">
            <option value="1" selected="selected">Search by Name</option>
            <option value="2">Search by ID</option>
            <option value="3">Search by Location</option>
        </select>
        <input id="serMemtb" type="text" style="width: 490px" placeholder="Type a name    (Lastname, Firstname)" />
        <input id="seMemBut" type="button" value="Search" />
    </div>

কেউ কি এটি বের করতে পারে?


আপনি কি আপনার এইচটিএমএল সরবরাহ করতে পারেন?
টিমোথি অ্যারন

@ টিমোথিআরন আমি এইচটিএমএল সরবরাহ
করেছি

@ ব্লানকাসাউরাস - বিএস এ বিল্ট ইন নেই have প্লেসহোল্ডার অ্যাট্রিবিউট আধুনিক ব্রাউজারগুলিতে নেটিভভাবে কাজ করে তবে IE এর জন্য কোনও পলিফিল নেই: github.com/twitter/bootstrap/issues/2401
জ্যানি

উত্তর:


367
$(document).ready(function(){ 
  $('form').find("input[type=textarea], input[type=password], textarea").each(function(ev)
  {
      if(!$(this).val()) { 
     $(this).attr("placeholder", "Type your answer here");
  }
  });
});

আপনার জেএস ফাইলে এই কোডটি অনুলিপি করুন এবং আটকান, এটি পুরো সাইট থেকে সমস্ত স্থানধারক পাঠ্য পরিবর্তন করবে।


1
আপনার- ifস্টেটমেন্টটি বাদ দেওয়া উচিত , সাধারণত ইনপুট উপাদানটির মান আছে কি না তা আপনি স্থানধারককে সেট করতে চান। অন্যথায়, ব্যবহারকারী যদি ইনপুট উপাদানটি খালি করে তবে কোনও স্থানধারক প্রদর্শিত হবে না।
isnot2bad

99

আপনি আইডি দ্বারা একটি স্থানধারক আপডেট করতে নিম্নলিখিত কোড ব্যবহার করতে পারেন:

$("#serMemtb").attr("placeholder", "Type a Location").val("").focus().blur();

16

সহজভাবে আপনি ব্যবহার করতে পারেন

$("#yourtextboxid").attr("placeholder", "variable");

যেখানে, যদি ভেরিয়েবলটি স্ট্রিং থাকে তবে আপনি উপরের মতো ব্যবহার করতে পারেন, যদি এটি ভেরিয়েবল হয় তবে এটি "ভেরিয়েবল" এর মতো ডাবল কোট সহ নামের সাথে প্রতিস্থাপন করুন।

যেমন: $("#youtextboxid").attr("placeholder", variable); এটি কাজ করবে।


13

প্লাগইনটি খুব মজবুত দেখাচ্ছে না। আপনি যদি .placeholder()আবার কল করেন Placeholderতবে ঘটনাগুলি এখনও পুরানোটির সাথে আবদ্ধ থাকা অবস্থায় এটি একটি নতুন উদাহরণ তৈরি করে ।

কোডটি দেখে মনে হচ্ছে আপনি করতে পারেন:

$("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").blur();

সম্পাদনা

placeholderএকটি হল HTML5 এর বৈশিষ্ট্য , অনুমান যারা সমর্থন না এসব?

আপনার প্লাগইনটি আপনাকে সত্যই এটি সমর্থন করে না যে আইই সমর্থন করে না, তাই আমার সমাধান কাজ করার সময় আপনার প্লাগইন এটি করে না। কেন যে আপনি খুঁজে পাবেন না।


8

$(this).val()একটি স্ট্রিং। parseInt($(this).val(), 10)'1' ব্যবহার করুন বা পরীক্ষা করুন । দশটি বেস 10 বোঝাতে হবে।

$(function () {
    $('input[placeholder], textarea[placeholder]').blur();
    $('#serMemdd').change(function () {
        var k = $(this).val();
        if (k == '1') {
            $("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").blur();
        }
        else if (k == '2') {
            $("#serMemtb").attr("placeholder", "Type an ID").blur();
        }
        else if (k == '3') {
            $("#serMemtb").attr("placeholder", "Type a Location").blur();
        }
    });
});

অথবা

$(function () {
    $('input[placeholder], textarea[placeholder]').placeholder();
    $('#serMemdd').change(function () {
        var k = parseInt($(this).val(), 10);
        if (k == 1) {
            $("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").blur();
        }
        else if (k == 2) {
            $("#serMemtb").attr("placeholder", "Type an ID").blur();
        }
        else if (k == 3) {
            $("#serMemtb").attr("placeholder", "Type a Location").blur();
        }
    });
});

অন্যান্য প্লাগইন

ori আমার নজরে এনেছে যে আপনি যে প্লাগইনটি ব্যবহার করছেন তা আইইএসএইচএমএল ব্যর্থতা কাটিয়ে উঠেনি।

এর মতো কিছু ব্যবহার করে দেখুন: http://archive.plugins.jquery.com/project/input- جگہধারক


ওপি-র জন্য দ্রষ্টব্য: এছাড়াও নোট করুন যে পরিবর্তন ইভেন্টটি পাঠ্য ইনপুট নয়, নির্বাচিত বাক্সে আবদ্ধ। $('#serMemdd').change(function () {
বেনজাম

আমার মনে হয় সার্মেমডডিডিডিএল-এর উপর ভিত্তি করে স্থানধারক পাঠ্যের প্রসঙ্গে সংবেদনশীল করার চেষ্টা করছি। আমি জানিনা.
জেসন

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

আপনি উত্তরটিকে একাধিকবার কল করে থাকলে .প্লেস হোল্ডার () স্টাফ আপকে ম্যাসেজ করার পরে আমার উত্তরটি অস্পষ্ট () দিয়ে আপডেট করেছে। আপনার এটিকে আপনার দস্তাবেজে কল করা উচিত it যদিও এটি সেট আপ করার জন্য প্রস্তুত।
জেসন

<নির্বাচন নাম = "ddselect" id = "serMemdd">
জেসন

2

জাভাস্ক্রিপ্ট এবং জ্যাকুয়ারি ব্যবহার করে গতিশীল স্থানধারীর কার্যকরী উদাহরণ http://jsfiddle.net/ogk2L14n/1/

<input type="text" id="textbox">
 <select id="selection" onchange="changeplh()">
     <option>one</option>
     <option>two</option>
     <option>three</option>
    </select>

function changeplh(){
    debugger;
 var sel = document.getElementById("selection");
    var textbx = document.getElementById("textbox");
    var indexe = sel.selectedIndex;

    if(indexe == 0) { 
     $("#textbox").attr("placeholder", "age");

}
       if(indexe == 1) { 
     $("#textbox").attr("placeholder", "name");
}
}


1

আপনার প্রথম লাইনটি নীচে সরানো আমার জন্য এটি: http://jsfiddle.net/tcloninger/SEmNX/

$(function () {
    $('#serMemdd').change(function () {
        var k = $(this).val();
        if (k == 1) {
            $("#serMemtb").attr("placeholder", "Type a name (Lastname, Firstname)").placeholder();
        }
        else if (k == 2) {
            $("#serMemtb").attr("placeholder", "Type an ID").placeholder();
        }
        else if (k == 3) {
            $("#serMemtb").attr("placeholder", "Type a Location").placeholder();
        }
    });
    $('input[placeholder], textarea[placeholder]').placeholder();
});

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



0

এটি আমার পক্ষে কাজ করেছে:

jQuery('form').attr("placeholder","Wert eingeben");

কিন্তু এখন এটি কাজ করে না:

// Prioritize "important" elements on medium.
            skel.on('+medium -medium', function() {
                jQuery.prioritize(
                    '.important\\28 medium\\29',
                    skel.breakpoint('medium').active
                );
            });


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