मुझे समारोह की एक साधारण गलती या गलतफहमी होनी चाहिए। जैसा कि आप नीचे देख सकते हैं, जब उपयोगकर्ता '-' टाइप करता है तो मैं '-' को '/' में बदलने की कोशिश कर रहा हूं। मैं इस ऑनकी को करने की कोशिश कर रहा हूं, यदि उपयोगकर्ता 12-12-12 में टाइप करता है। यह तुरंत सभी 3 धराशायी को बदल देगा पूर्व: उपयोगकर्ता 12 की तरह प्रवेश करता है- फ़ंक्शन 12/तुरंत हो जाता है।

मैं यहाँ क्या गलत कर रहा हूँ।

function onkey(){
var user_input = document.getElementById('date_val').value;
// if(user_input.includes("-")){
// console.log("detects")
// user_input.replace(/-/g, "/");
// }
user_input.includes("-")? console.log("detects") && user_input.replace(/-/g, "/"):user_input;
}
<!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">
  <title>Document</title>


</head>

<body>
date :<input type="text" id="date_val"  onkeyup="onkey()"> 
  

  <script src="./js/test.js"></script>
</body>

</html>
0
jsPlayer 27 मार्च 2018, 20:36

6 जवाब

सबसे बढ़िया उत्तर

आपको फ़ंक्शन replace.

फ़ंक्शन को अपनाएं addEventListener घटनाओं को अपने तत्वों से बाँधने के लिए।

document.getElementById('date_val').addEventListener('keyup', function() {
  this.value = this.value.replace(/-/g, "/");
});
Date :<input type="text" id="date_val">   

यह उस इनपुट क्षेत्र में प्रत्येक परिवर्तन को कैप्चर करने के लिए ईवेंट input का उपयोग करने का एक विकल्प है।

इस तरह, आप एक बेहतर उपयोगकर्ता अनुभव प्रदान करेंगे और ड्रैग, ड्रॉप और टेक्स्ट पेस्ट जैसे हर बदलाव को भी हैंडल करेंगे। देखें कि जब आप लिख रहे हैं तो प्रतिस्थापन कैसे दिखाई नहीं दे रहा है।

document.getElementById('date_val').addEventListener('input', function() {
  this.value = this.value.replace(/-/g, "/");
});
Date :<input type="text" placeholder="Paste, Drag & Drop text" id="date_val">
1
Ele 27 मार्च 2018, 17:48

Document.getElementById('date_val').value = user_input.replace(/-/g, "/");

0
Ashraf Samir 27 मार्च 2018, 17:50

आपको तत्व का मान सेट करना होगा dateElement.value = user_input.replace(/-/gi, "/");

साथ ही, .replace स्ट्रिंग को संशोधित नहीं करता है। यह एक नई स्ट्रिंग लौटाता है, इसलिए आपका user_input नहीं बदला होगा।

मैं थोड़ा और अधिक पठनीय और पुन: सक्रिय होने के लिए कोड को थोड़ा और साफ करता हूं।

आपको include चेक की भी आवश्यकता नहीं है, क्योंकि इसे वैसे भी पूरी स्ट्रिंग से गुजरना पड़ता है। आप हर बार बस बदल सकते हैं, क्योंकि यह शायद उसी ओवरहेड के काफी करीब है।

function onkey(){
    var dateElement = document.getElementById('date_val');
    
    dateElement.value = dateElement.value.replace(/-/g, "/");
}
<!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">
  <title>Document</title>
</head>

<body>
    date :<input type="text" id="date_val"  onkeyup="onkey()"> 
</body>

<script src="./js/test.js"></script>

</html>
1
adprocas 27 मार्च 2018, 17:48

MDN से

प्रतिस्थापन () विधि प्रतिस्थापन द्वारा प्रतिस्थापित पैटर्न के कुछ या सभी मिलानों के साथ एक नई स्ट्रिंग लौटाती है। पैटर्न एक स्ट्रिंग या एक RegExp हो सकता है, और प्रतिस्थापन एक स्ट्रिंग या एक फ़ंक्शन हो सकता है जिसे प्रत्येक मैच के लिए बुलाया जा सकता है।

आपको तत्व का मान रीसेट करना होगा:

function onkey(){
  var user_input = document.getElementById('date_val').value;
  document.getElementById('date_val').value =  user_input.replace(/-/g, "/");
}
date :<input type="text" id="date_val"  onkeyup="onkey()"> 
  
1
Mamun 27 मार्च 2018, 17:46

जब आप इनपुट से कोई मान पढ़ते हैं, तो आपको स्ट्रिंग का एक नया उदाहरण मिलता है, आपको इसे वापस इनपुट पर असाइन करने की आवश्यकता होती है।

function onkey() {
  const input = document.getElementById('date_val');
  const user_input = input.value;
  const newValue = user_input.includes("-") ? user_input.replace(/-/g, "/") : user_input;
  console.log(newValue);
  input.value = newValue;
}
date :<input type="text" id="date_val" onkeyup="onkey()">
1
felixmosh 27 मार्च 2018, 17:42

String.replace एक नया स्ट्रिंग देता है। मान बदलने के लिए, आपको document.getElementById('date_val').value = user_input.replace(/-/g, "/"); की आवश्यकता होगी

1
AnilRedshift 27 मार्च 2018, 17:39