如何将下一个文本区域集中在按钮上

Question

我正在尝试做类似社交网络的操作，但是我在使用jquery时遇到问题，我想通过单击评论按钮将用户转到评论字段，但是我无法使用$（this）。

当用户单击此处

代码：

override func viewDidLoad() {
        super.viewDidLoad()

        // Do any additional setup after loading the view.
        let datePickerView: UIDatePicker = UIDatePicker()
        datePickerView.datePickerMode = .time

        startField.inputView = datePickerView
        finishField.inputView = datePickerView


        datePickerView.addTarget(self, action: #selector(ViewController.datePickerValueChanged), for: UIControl.Event.valueChanged)
    }


@objc func datePickerValueChanged(sender: UIDatePicker) {

        let dateFormatter = DateFormatter()

        dateFormatter.dateFormat = "HH:mm"

        startField.text = dateFormatter.string(from: sender.date)

    }

字段：

代码：

 <button type="button" class="btn btn-default abreComentarios" >
   <span  class="fa fa-comments-o"></span>
 </button>

我的jquery：

<div class="comentar">
    <textarea class="txtComentario form-control caixaComentario" placeholder="Seu comentário" onkeypress="comentarEnter()"></textarea>
</div>

请记住，我使用的是foreach，因此必须使用$('body').on('click', '.abreComentarios', function() { //console.log('entrou'); $(this).next('.caixaComentario').focus(); });

Answer 1

您的next()不是.caixaComentario，而是.comentar，

因此，请使用next()，但随后必须使用find()（或children()）来聚焦文本区域

$('.abreComentarios').on('click', function() {
  //console.log('entrou');
  $(this).next('.comentar').find('.caixaComentario').focus();
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<button type="button" class="btn btn-default abreComentarios">click</button>

<div class="comentar">
  <textarea class="txtComentario form-control caixaComentario" placeholder="Seu comentário"></textarea>
</div>

Answer 2

$（this）将是您的<button>，但是调用.next（“。caixaComentario”）会在按钮上寻找同级元素。如果您的<div class="comentar">和 DROP TABLE IF EXISTS FacultyDim; CREATE TABLE FacultyDim ( FacultyKey bigint NOT NULL AUTO_INCREMENT, FacultyID bigint NOT NULL, FacultyName varchar(32) NOT NULL, PRIMARY KEY (FacultyKey, FacultyID) )ENGINE=InnoDB; DROP TABLE IF EXISTS `Group`; CREATE TABLE `Group` ( GroupID bigint NOT NULL, FacultyID bigint NOT NULL, GroupName varchar(32) NOT NULL, PRIMARY KEY (GroupID), FOREIGN KEY (FacultyID) REFERENCES FacultyDim(FacultyID,FacultyKey) )ENGINE=InnoDB; 是同级，则.next（“。caixaComentario”）不会匹配任何元素，因为它们不是同级。那是侄女/侄子。

尝试将.next（“。caixaComentario”）更改为.next（“ div .caixaComentario”）

Answer 3

解决了，我刚刚做到了：

1-在按钮中添加了带有帖子ID的数据ID

<button type="button" class="btn btn-default abreComentarios" data-id="'.$post->id.'"><span class="fa fa-comments-o"></span></button>

2-在类“ caixaComentario”的名称末尾添加了相同的ID

<div class="comentar"> <textarea class="form-control caixaComentario'.$post->id.'" placeholder="Seu comentário" onkeypress="comentarEnter()"></textarea> </div>

3-在jQuery上没有$（this）调用

$('body').on('click', '.abreComentarios', function() { var id = $(this).data("id"); $('.caixaComentario'+id).focus(); });

工作：D