কোড আইই ১১ তে চলছে না, ক্রোমে দুর্দান্ত কাজ করে


156

নিম্নলিখিত কোডটি Chrome এ সমস্যা ছাড়াই চালানো যেতে পারে তবে ইন্টারনেট এক্সপ্লোরার 11-এ নিম্নলিখিত ত্রুটিটি ছুঁড়ে দেয়।

অবজেক্ট সম্পত্তি বা পদ্ধতি 'প্রারম্ভের সাথে' সমর্থন করে না

আমি একটি ভেরিয়েবলে উপাদানটির আইডি সঞ্চয় করছি। সমস্যা কি?

function changeClass(elId) {
  var array = document.getElementsByTagName('td');
  
  for (var a = 0; a < array.length; a++) {
    var str = array[a].id;
    
    if (str.startsWith('REP')) {
      if (str == elId) {
        array[a].style.backgroundColor = "Blue";
        array[a].style.color = "white";
      } else {
        array[a].style.backgroundColor = "";
        array[a].style.color = "";
      }
    } else if (str.startsWith('D')) {
      if (str == elId) {
        array[a].style.backgroundColor = "Blue";
        array[a].style.color = "white";
      } else {
        array[a].style.backgroundColor = "";
        array[a].style.color = "";
      }
    }
  }
}
<table>
  <tr>
    <td id="REP1" onclick="changeClass('REP1');">REPS</td>
    <td id="td1">&nbsp;</td>
  </tr>
  <tr>
    <td id="td1">&nbsp;</td>
    <td id="D1" onclick="changeClass('D1');">Doors</td>
  </tr>
  <tr>
    <td id="td1">&nbsp;</td>
    <td id="D12" onclick="changeClass('D12');">Doors</td>
  </tr>
</table>


9
str.indexOf("REP") == 0পরিবর্তে আপনার সম্ভবত IE এর জন্য ব্যবহার করতে হবে।
গ্র্যান্ট থমাস

1
ইএস yet এখনও মানক নয় ক্যানগ্যাক্স.সিথুব.আইও / কমপ্যাট- টেবিল / এস There স্থানান্তরিত করার জন্য একটি ইএস 6 শিম গ্রন্থাগার রয়েছে github.com/paulmillr/es6-shim যেমন ES5 এর মতো (সব কিছু শিথিলযোগ্য নয়)
Xotic750

উত্তর:


320

String.prototype.startsWith জাভাস্ক্রিপ্ট, ES6 এর অতি সাম্প্রতিক সংস্করণে একটি স্ট্যান্ডার্ড পদ্ধতি।

নীচের সামঞ্জস্যতার টেবিলটি দেখে আমরা দেখতে পাচ্ছি যে এটি ইন্টারনেট এক্সপ্লোরারের সংস্করণগুলি বাদে সমস্ত বর্তমান প্রধান প্ল্যাটফর্মগুলিতে সমর্থিত ।

╔═══════════════╦════════╦═════════╦═══════╦═══════════════════╦═══════╦════════╗
    Feature     Chrome  Firefox  Edge   Internet Explorer  Opera  Safari 
╠═══════════════╬════════╬═════════╬═══════╬═══════════════════╬═══════╬════════╣
 Basic Support     41+      17+  (Yes)  No Support            28       9 
╚═══════════════╩════════╩═════════╩═══════╩═══════════════════╩═══════╩════════╝

আপনার .startsWithনিজের প্রয়োগ করতে হবে । এখানে পলিফিল :

if (!String.prototype.startsWith) {
  String.prototype.startsWith = function(searchString, position) {
    position = position || 0;
    return this.indexOf(searchString, position) === position;
  };
}

3
এমডিএন ওয়েব String.prototype.startsWith = function(search, pos) { return this.substr(!pos || pos < 0 ? 0 : +pos, search.length) === search; };
ডক্সে

1
আমি @ ওকার দেওয়া প্রথম প্রয়োগের দিকে ঝোঁক। "পজিশন" সত্যিকারের সংখ্যাসূচক হওয়ার জন্য যেমন একটি অতিরিক্ত পরিশোধনকারী পরীক্ষা করতে পারে ঠিক তেমনি অবস্থান =! IsNaN (parseInt (পজিশন))? অবস্থান: 0;
আর্নেস্তভ

36

text.indexOf("newString")পরিবর্তে সেরা পদ্ধতি startsWith

উদাহরণ:

var text = "Format";
if(text.indexOf("Format") == 0) {
    alert(text + " = Format");
} else {
    alert(text + " != Format");
}

কেন এটি সেরা পদ্ধতি?
টাইলার

1
সূচনা প্রতিস্থাপনের ক্ষেত্রে সূচিপত্রের পদ্ধতিটি, প্রদত্ত স্ট্রিংয়ের যে কোনও জায়গায় মিলে গেলে সূচিপত্র মান ফেরত দেবে, আমি সূচিপত্র ব্যবহার করার পরামর্শ দিচ্ছি না।
রাজকুমার সমালা

12
indexOfরিটার্ন মান দেয়, তবে @ জোনা যাচাই করেছে যে রিটার্নের মান শূন্য (অর্থাত্ স্ট্রিংটি শুরুতে রয়েছে), যার অর্থ এটির জন্য ভাল প্রতিস্থাপন startsWith!
শার্পসি

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

13

এই যদি কৌণিক 2+ আবেদন ঘটছে, আপনি পারবেন শুধু uncomment মধ্যে স্ট্রিং polyfills polyfills.ts :

import 'core-js/es6/string';

আমি ওকার পলিফিল ফিক্স যুক্ত করেছি, তবে এটি আমার অ্যাঙ্গুলার 5 অ্যাপ্লিকেশনটিতে আমার পক্ষে কার্যকর হয়নি, তবে এটি import 'core-js/es6/string';স্থির করে। অনেক ধন্যবাদ!
10

5

সূচনাগুলি এর সাথে ফাংশনটি প্রতিস্থাপন করুন:

yourString.indexOf(searchString, position) // where position can be set to 0

এটি IE সহ সমস্ত ব্রাউজার সমর্থন করবে

স্ট্রিং ম্যাচিংয়ের জন্য পজিশনটি 0 তে সেট করা যেতে পারে যার অর্থ 0 তম অবস্থান।


প্রোটোটাইপগুলি পুনরায় লিখতে না পলিফিল ব্যবহার না করে দরকারী সমাধান। প্লাস এটি ব্রাউজারগুলির মধ্যে প্রশস্ত সামঞ্জস্যপূর্ণ। +1
সেরজিও এ।

2

অন্যরা যেমন বলেছে যে শুরুগুলি এবং শেষগুলিই ইএস 6 এর অংশ এবং আইই 11 এ উপলব্ধ নয়। আমাদের সংস্থা সর্বদা আইইডির জন্য পলিফিল সমাধান হিসাবে লোডাশ লাইব্রেরি ব্যবহার করে। https://lodash.com/docs/4.17.4

_.startsWith([string=''], [target], [position=0])

0

ওকার পোস্ট দুর্দান্ত কাজ করার সময় এটি কিছুটা পুরানো হতে পারে। আমি বুঝতে পেরেছি যে লডাশ এটি একটি একক ফাংশন দিয়ে মোকাবেলা করতে পারে। আপনি লড্যাশ ইনস্টল করা থাকলে এটি আপনাকে কয়েকটি লাইন সংরক্ষণ করতে পারে।

ঠিক করার চেষ্টা করুন:

import { startsWith } from lodash;

। । ।

    if (startsWith(yourVariable, 'REP')) {
         return yourVariable;        
    return yourVariable;
       }      
     }

0

আমি সম্প্রতি প্রোব সম্মুখীন। আমি সমাধান করেছিলাম start যা শুরুতে অনুরূপ jquery। বলুন,

var str = array[a].id;
if (str.startsWith('REP')) {..........}

আমরা ব্যবহার করতে পারি

if($("[id^=str]").length){..........}

এখানে, str মৌলিক আইডি।


0

কৌণিক 2 + প্রকল্পের সাথে কাজ করার সময় সমস্যা দেখা দিলে এই পদ্ধতিটি অনুসরণ করুন

আমি যখন এই ত্রুটিটি পেয়েছি তখন আমি একটি সমাধান খুঁজছিলাম এবং এটি আমাকে এখানে পেয়েছে। তবে এই প্রশ্নটি সুনির্দিষ্ট মনে হলেও ত্রুটিটি নয়, এটি একটি সাধারণ ত্রুটি। এটি ইন্টারনেট এক্সপ্লোরার ব্যবহার করে কৌণিক বিকাশকারীদের পক্ষে একটি সাধারণ ত্রুটি।

কৌনিক 2+ এর সাথে কাজ করার সময় আমার একই সমস্যা ছিল এবং এটি কয়েকটি সাধারণ পদক্ষেপের দ্বারা সমাধান হয়ে গেছে।

কৌণিক সর্বশেষ সংস্করণগুলিতে, পলিফিলস.টসে মন্তব্য কোড রয়েছে যা ইন্টারনেট এক্সপ্লোরার সংস্করণগুলি IE09, IE10 এবং IE11 এ মসৃণভাবে চলার জন্য প্রয়োজনীয় সমস্ত পলিফিলগুলি দেখায়

/** IE9, IE10 and IE11 requires all of the following polyfills. **/
//import 'core-js/es6/symbol';
//import 'core-js/es6/object';
//import 'core-js/es6/function';
//import 'core-js/es6/parse-int';
//import 'core-js/es6/parse-float';
//import 'core-js/es6/number';
//import 'core-js/es6/math';
//import 'core-js/es6/string';
//import 'core-js/es6/date';
//import 'core-js/es6/array';
//import 'core-js/es6/regexp';
//import 'core-js/es6/map';
//import 'core-js/es6/weak-map';
//import 'core-js/es6/set';

কোডগুলি কমেন্ট করুন এবং এটি IE ব্রাউজারগুলিতে পুরোপুরি কাজ করবে

/** IE9, IE10 and IE11 requires all of the following polyfills. **/
import 'core-js/es6/symbol';
import 'core-js/es6/object';
import 'core-js/es6/function';
import 'core-js/es6/parse-int';
import 'core-js/es6/parse-float';
import 'core-js/es6/number';
import 'core-js/es6/math';
import 'core-js/es6/string';
import 'core-js/es6/date';
import 'core-js/es6/array';
import 'core-js/es6/regexp';
import 'core-js/es6/map';
import 'core-js/es6/weak-map';
import 'core-js/es6/set';

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

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