反应-复制到剪贴板-按钮

时间:2020-07-20 18:11:38

标签: javascript reactjs

我在div中有类似的东西

  <div className="generated-voucher-code-details">
                <p>Your voucher Code is <span style={{color:'#000000', fontWeight:'500'}}>“X1X1X1“</span>.</p>
                <p>To know more on how to redeem the gift card visit the link <span style={{color:'#C7417B'}}>stores.com</span></p>
                <p>Choose Preferred date, Time, Number of People and Book Now.</p>
                <p>Apply voucher code in Have a Xoxo Voucher Check Box.</p>
                <p>Pay Extra Amount if any through other mode of payments.</p>
                <p>Your order is successfully placed.</p>
                <p>You will receive confirmation within 24 hours.</p>
  </div>

此Div位于一个框中,假设在此框下面,我有一个按钮。

现在,当我们单击此按钮时如何复制整个文本?

2 个答案:

答案 0 :(得分:0)

欢迎堆栈溢出。

请检查下面的工作代码示例。

createOneTapUser: async (userDetails, accessDetails) => {
  //just including details here for what part of a user object would look like from Meteor.loginWithGoogle > note especially resume > loginTokens
  let oneTapUserObj = {
    services: {
      google: {
        accessToken: accessDetails.access_token,
        idToken: accessDetails.id_token,
        scope: ["https://www.googleapis.com/auth/userinfo.email", "https://www.googleapis.com/auth/userinfo.profile", "openid"], // yours may be different...
        expiresAt: accessDetails.expires_at,
        id: userDetails.sub,
        email: userDetails.email,
        verified_email: userDetails.email_verified,
        name: userDetails.name,
        given_name: userDetails.given_name,
        family_name: userDetails.family_name,
        picture: userDetails.picture,
        locale: "en"
      },
      resume: {
        loginTokens: []
      }
    } //...whatever your user object normally looks like.
  };
  //manually inserting the user
  Meteor.users.insert(oneTapUserObj);

  let newOneTapUser = await Meteor.users.findOne({ "profile.email": userDetails.email });
  // generates the login token that goes under user > services > resume > loginTokens...
  let stampedLoginToken = Accounts._generateStampedLoginToken();
  Accounts._insertLoginToken(newOneTapUser._id, stampedLoginToken);

  //sets the social media image from the google account...you'll need to build your own...
  userDetails.picture ? scrapeSocialMediaImage(newOneTapUser._id, userDetails.picture) : console.log("Google One Tap user " + newOneTapUser._id + " has no profile picture...");

  return stampedLoginToken.token;
}

感谢https://www.sitepoint.com/community/t/how-to-select-text-between-div-tag-using-js/4283/5

答案 1 :(得分:0)

您可以使用document.execCommand("copy")来实现它。

有关更多详细信息,请访问此link