skip to Main Content

Hey i am trying some thing for my school project, i hope you can help me in it.

I want to copy the substring from url, like
Url = https://www.example.com/blah/blah&code=12432
substring = 12432

Also i want to print the substring in Copy Box .

Please Help Me with this issue. It is required for my project to copy some text from string.

(function() {
  var copyButton = document.querySelector('.copy button');
  var copyInput = document.querySelector('.copy input');
  copyButton.addEventListener('click', function(e) {
    e.preventDefault();
    var text = copyInput.select();
    document.execCommand('copy');
  });

  copyInput.addEventListener('click', function() {
    this.select();
  });
})();







   html, body {
          height: 100%;
        }
    
        body {
          font-size: 16px;
          background: #FFD1DD;
          display: flex;
          align-items: center;
          justify-content: center;
        }
    
        * {
          box-sizing: border-box;
        }
    
        .wrapper {
          padding: 0 5px;
        }
    
        h1 {
          text-align: center;
          font-size: 40px;
          margin-bottom: 1.2em;
          text-decoration: underline;
          text-transform: uppercase;
        }
    
        p {
          font-family: 'VT323', monospace;
          font-size: 20px;
        }
    
        .container {
          display: flex;
          background: #FFA3BB;
          border-radius: 7px;
          padding: 10px;
          margin: 0 auto;
        }
    
        h3 {
          font-size: 28px;
          text-transform: uppercase;
          text-align: center;
          
          span {
            display: inline-block;
            position: relative;
          }
        }
    
        .copy, .paste {
          flex-grow: 1;
          width: 50%;
        }
    
        .copy {
          border-right: 2px solid;
          padding-right: 10px;
          
          h3 {
            span {
              background: #76ECFF;
            }
          }
          
          input {
            padding-right: 90px;
          }
        }
    
        .paste {
          padding-left: 10px;
          
          h3 {
            span {
              background: #FAE916;
            }
          }
        }
    
        form {
          position: relative;
          width: 100%;
          
          input {
            display: block;  
            width: 100%;
            border: 3px solid;
            outline: 0;
            background: #FFF;
            font-size: 25px;
            padding: 5px 4px;
            margin-bottom: 20px;
          }
          
          button {
            display: block;
            position: absolute;
            top: 50%;
            right: 10px;
            transform: translateY(-50%);
            border: 0;
            outline: 0;
            color: #FFF;
            background: #000;
            font-family: 'VT323', monospace;
            font-size: 25px;
            text-transform: uppercase;
            padding: 0.08em 0.8em;
            cursor: pointer;
          }
        }

<div class="wrapper">
  <h1>Link Copy</h1>
  
  <p>Select the link text by clicking within the input then copy yourself or just click the copy button.  Paste into the paste side to see that it works!</p>
  <div class="container">
    <div class="copy">
       <h3>Copy <span><i class="fa fa-hand-peace-o"></i></span></h3>
      <form>
        <input type="text" value="https://codepen.io/she_codes/pen/OgrJJe/">
        <button type="button">Copy</button>
      </form>
    </div>
    <div class="paste">
      <h3>Paste <span><i class="fa fa-smile-o"></i></span></h3>
      <form>
        <input type="text">
      </form>
    </div>
  </div><!-- end .container -->
</div><!-- end .wrapper -->

2

Answers


  1. try this, assuming nothing is ever after "code="

    var url = window.location.href;
    var index = url.indexOf("code=");
    var substring = url.substring(index + 5);
    copyInput.setAttribute('value', substring);
    
    Login or Signup to reply.
  2. Use this it will work

    const params = new Proxy(new URLSearchParams(window.location.search), {
          get: (searchParams, prop) => searchParams.get(prop),
        });
        // Get the value of "some_key" in eg "https://example.com/?some_key=some_value"
        let value = params.some_key; // "some_value"
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search