Question

当我点击扩展按钮时， plugin.html 就可以了，但第一个按钮似乎是预选的，没有点击或悬停它：

＆＃13;

$(document).ready(function(){
    $(".copy").click(function() {
        $(".status").show().removeClass('hide').text("You successfully copied the answers.");

        getAnswers();

        setTimeout(function() {
            $(".status").fadeOut();
        }, 5000);
    });

    $(".paste").click(function() {
        $(".status").show().removeClass('hide').text("You successfully pasted the answers.");

        getAnswers();

        setTimeout(function() {
            $(".status").fadeOut();
        }, 5000);
    });
});

function getAnswers(){
    console.log('In getAnswers');
}

＆＃13;

<!doctype html>
<html>
<head>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <meta charset="utf-8">
    <meta name="description" content="This extension helps copy and paste questions and answers for the Kinesiology institute.">
    <meta name="author" content="Chris Breuer">

    <title>Title</title>

    <!-- Scripts -->
    <!--Needed in an extension, but not in this snippet
    <script src="js/jquery-3.1.1.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/popup.js"></script>
    -->

    <!-- Cascading Style Sheets -->
    <!-- Need a different source for the Bootstrap CSS in this snippet
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
    -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link href="css/custom.css" rel="stylesheet" media="screen">

</head>
	
<body>
  
    <button class="btn btn-default copy" style="margin-left: 15px">Copy Answers</button>
    <button class="btn btn-default pull-right paste" style="margin-right: 15px">Paste Answers</button>

</body>
</html>

＆＃13;

如何确保点按两次按钮不会点击getAnswers()？

Answer 1

关于焦点，如何在$（document）.ready函数内的元素上添加手动模糊（失去焦点）？我会把它贴在顶端。

$(".copy").blur();

Answer 2

可以添加

$(document).ready(function(){
    $(".copy").blur();
    $(".paste").blur();
 ...

在你的jQuery之上？这应该失去焦点。

按钮似乎是预先选择的，只有在点击2次后才会触发

2 个答案: