小编chr*_*s_s的帖子

在设定的时间后从DOM中删除元素

我试图找出在事件发生后从DOM中删除元素的React方法.

我试图copySuccessonClick={this.props.handleCopyFact}触发时闪烁警报(),然后在5秒后淡出警报.每个状态都在父组件中设置.

这是我的组件的代码:

module.exports = React.createClass({

render: function() {

var copy = null;
if (!this.props.copying && !this.props.editting) {
  copy = (
    <div className="copy-fact-container" onClick={this.props.handleCopyFact}>
      <i className="icon-copy"></i>
      <span>Copy</span>
    </div>
    );

}

var copySuccess = null;
if (this.props.copySuccess) {
  copySuccess = (
    <div className="copy-success">
      <div><i className="icon icon-clipboard"></i></div>
      <p className="heading">Copied to Clipboard</p>
    </div>
    );
}

return (
  <div className="row-body"
    onMouseEnter={this.props.toggleCopyFact}
    onMouseLeave={this.props.toggleCopyFact}>
    <MDEditor editting={this.props.editting}
      content={this.props.content}
      changeContent={this.props.changeContent}/>
  {copy}
  {copySuccess}
  </div>
);
}
});
Run Code Online (Sandbox Code Playgroud)

javascript reactjs

14
推荐指数
3
解决办法
2万
查看次数

跳转到锚标记而不在URL中显示主题标签

我正在使用jQuery在onload用户点击帖子标题时在特定主题标签(通过主体类中的函数)加载页面.标签显然出现在网址中.我想知道是否有办法隐藏主题标签使URL混乱.有些搜索并没有提出太多.

function goToAnchor() {
    location.href = "#post";
}
Run Code Online (Sandbox Code Playgroud)

jquery

7
推荐指数
2
解决办法
2万
查看次数

链接单选按钮和文本输入

我正在尝试将无线电输入与指定的文本输入相关联。正如您在图片中看到的,有两个选项。我知道我可以使用for=""将标签与单选输入相关联,但是我如何将它与下面的文本输入相关联,反之亦然,所以当我专注于文本输入时,如果聚焦正确的单选按钮?

收音机和文本输入

注意:输入的金额将被插入到数据库中,因此这是此表格中最重要的部分。目前,如果我点击 $Off,我仍然可以在 %Off 中输入一个数字。我不希望这种情况发生,因此用户不会感到困惑。

我的标记:

<div class="row-fluid control-group">
  <div class="span7 pull-left">
    <label class="radio" for="discount-dollars">
      <input type="radio" name="discount" id="discount-dollars" value="dollars" checked="checked">
      &#36; Off
    </label>
    <div class="input-append">
      <input type="text" name="discount-dollars-amount" id="discount-dollars-amount" class="input-small dollars" placeholder="enter amount">
      <span class="add-on">.00</span>
    </div>
  </div><!-- .span7 .pull-left -->

  <div class="span5">
    <label class="radio" for="discount-percent">
      <input type="radio" name="discount" id="discount-percent" value="percent">
      &#37; Off
    </label>
    <input type="text" name="discount-percent-amount" id="discount-percent-amount" class="input-small percent" placeholder="enter amount" disabled="disabled">
  </div>
</div><!-- .row-fluid .control-group -->

<script type="text/javascript">

$(function (){
  $("form input[type=radio]").click(function (){

  // get the …
Run Code Online (Sandbox Code Playgroud)

html forms input textinput radio-button

5
推荐指数
1
解决办法
2万
查看次数

jQuery animate()将div向右移动,然后向左移动,点击

我试图让div向右滑动然后向左滑动.我目前有这个代码,但它向右滑动,然后立即向后滑动,没有第二次点击.我也试图实现切换,但最终打破了脚本.我感觉如此接近,但似乎无法指出它.

$(function(){
    $("#click").click(function(){
        $("#click").animate({left:'+=100px'}, 'fast');
    });

    $("#click").click(function() {
        $("#click").animate({left:'0'}, 'fast');
    });
});
Run Code Online (Sandbox Code Playgroud)

jquery jquery-animate

4
推荐指数
1
解决办法
2万
查看次数

解释这个Uncaught TypeError:对象[object Object]的属性'x'不是函数

有人可以解释为什么我会在以下每种情况下得到我的结果吗?我希望了解为什么结果是关于JavaScript如何与范围一起工作的结果,如果这就是问题所在.在第一个例子中,我的代码正常运行.

var Employees = function(name, salary) {
    this.name = name;
    this.salary = salary;

    this.addSalary = addSalaryFunction;

    this.getSalary = function() {
        return this.salary;
    };

};

var addSalaryFunction = function(addition) {
        this.salary = this.salary + addition;
    };


var ceo = new Employees("Chris", 400000);
ceo.addSalary(20000);
document.write(ceo.getSalary());
Run Code Online (Sandbox Code Playgroud)

如果我移动addSalaryFunctionEmployees功能,以下this.addSalary我得到的遗漏的类型错误.

var Employees = function(name, salary) {
    this.name = name;
    this.salary = salary;

    this.addSalary = addSalaryFunction;

    this.getSalary = function() {
        return this.salary;
    };

    var addSalaryFunction = function(addition) {
        this.salary = this.salary …
Run Code Online (Sandbox Code Playgroud)

javascript scope

2
推荐指数
1
解决办法
1287
查看次数

ajax表单提交后跳转到ID

我有以下表格.提交搜索表单并通过ajax调用返回结果后,我希望页面跳转到ID - 这恰好是结果的顶部.

<form class="avail-form">
  ...
   <input type="submit" value="search" />
</form>

<div id="results">Results Found</div>
.
. Results
.
Run Code Online (Sandbox Code Playgroud)

目前的尝试不起作用.

$(document).ready(function() {
    $('form.avail-form').click(function() {
        $(this).scrollTop($('#results').offset().top);
    });
});
Run Code Online (Sandbox Code Playgroud)

我尝试使用submit而不是click没有运气.我尝试了一堆不同的apporaches,但似乎无法做到正确.

ajax jquery

1
推荐指数
1
解决办法
560
查看次数

了解如何使用Flummox实现Flux架构

我目前有一个非常简单的React应用程序,它使用state来确定几个视图.单击submit元素将触发对通过登录或注册凭据的端点的简单调用.我可以继续沿着这条路走下去,使用从服务器返回的React和JSON来确定我的观点,但我知道处理数据的方式并不合适.

我的问题是,从这里开始,如何使用Flummox实现Flux模式?我是否使用有效负载触发操作并在操作或商店中进行API调用?我正在尝试理解从我的UI中的动作到我的API调用进行此往返的正确方法,以获取响应和UI响应商店的更改.

下面是我的Auth组件的代码.我想看一个如何在这种情况下使用Flummox的示例,这样我就可以理解扩展和添加功能所需的内容.

Auth.jsx

'use strict';

var React  = require('react');
var request = require('request');

var Auth = React.createClass({

  getInitialState: function() {
    return {
      name: '',
      email: '',
      pass: '',
      passConfirm: '',
      login: true,
      register: false
    };
  },

  handleLogin: function(){
    this.setState({
      login: true,
      register: false
    });
  },

  handleRegister: function(){
    this.setState({
      register: true,
      login: false
    });
  },

  handleName: function(event){
    this.setState({
      name: event.target.value
    });
  },

  handleEmail: function(event){
    this.setState({
      email: event.target.value
    });
  },

  handlePass: function(event){
    this.setState({
      pass: event.target.value
    });
  },

  handlePassConfirm: function(event){
    this.setState({
      passConfirm: …
Run Code Online (Sandbox Code Playgroud)

flux reactjs reactjs-flux flummox

1
推荐指数
1
解决办法
1017
查看次数