手风琴标题中的输入在按下的空格键上折叠

时间:2014-10-29 00:30:15

标签: jquery accordion jquery-ui-accordion

我正在使用手风琴结构作为动态标签,当按下空格按钮以在折叠的手风琴的标题部分中的两个单词之间给出空格时,我遇到了问题,这里是页面的链接{{3我使用的代码是

    $( ".questions" ).accordion({
        header: "> div > h3",
        collapsible: true,
        active: 0,
        autoHeight: false,
        autoActivate: true
    });



    $( "button" ).button();
    $('#addAccordion').click( function() {
        var newDiv = "<div><h3><a>Q4 New Question</a><input type='text'/name='' vlaue=''></h3><div>New Content</div></div>";
        $('.questions').append(newDiv)
        $('.questions').accordion("refresh").accordion( "option", "active", $('.questions > div').length - 1 );
    });

    $(".questions h3 input").on('keydown', function (e) {
        e.stopPropagation();
    })
});

请任何人帮助我。

提前致谢

1 个答案:

答案 0 :(得分:0)

如果现在有帮助,它将为您工作。

$(document).ready(function() {


  $(".questions").accordion({
    header: "> div > h3",
    collapsible: true,
    active: 0,
    autoHeight: false,
    autoActivate: true
  });



  $("button").button();
  $('#addAccordion').click(function() {
    var newDiv = "<div><h3><a>Q4 New Question</a><input type='text'/name='' vlaue=''></h3><div>New Content</div></div>";
    $('.questions').append(newDiv)
    $('.questions').accordion("refresh").accordion("option", "active", $('.questions > div').length - 1);
  });

  $(".questions h3 input").keydown(function(e) {
    e.stopPropagation();
  })
});
<link href="http://code.jquery.com/ui/jquery-ui-git.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.0/jquery-ui.min.js"></script>


<div class="questions">
  <div>
    <h3><a href="#">Question 1. My First Question ?</a>
      <input type="text" name=" " value="" /></h3>
    <div>
      First content<br />
    </div>
  </div>
  <div>
    <h3><a href="#">Question 2. My Second Question ?</a>
      <input type="text" name=" " value="" /></h3>
    <div>
      Second content<br />
    </div>
  </div>

  <div>
    <h3><a href="#">Question 3. My Third Question ?</a>
      <input type="text" name=" " value="" /></h3>
    <div>
      Third content<br />
    </div>
  </div>
</div>
<div>
  <button id="addAccordion">Add Accordion</button>
</div>

我已将您的.on更改为.keydown