Question

我正在使用css隐藏<div>，我想在点击按钮时显示它。

这是我的代码，

function jobs_form_search_api_saved_searches_save_form_alter(&$form, &$form_state, $form_id) {
  $form['actions']['set'] = array(

        '#type' => 'submit',
        '#value' => t('set'),
        '#submit' => array('jobs_search_alert_mail_submit'),
        '#weight' => 3,
         );

             }

我可以添加设置按钮，任何人都可以帮助我当我点击按钮时如何显示隐藏的<div>？

Answer 1

好吧，因为您的问题没有其他HTML或JS，这里有一个基本示例，您可以如何实现这一目标。

<强> CSS

var expect = require('chai').expect,
    sinon = require('sinon'),
    mockery = require('mockery');

describe('bidding-war-server', function () {
    var biddingWarServer,
        stubbedIo;

    beforeEach(function () {
        stubbedIo = {
            on: function() { }
        };
        var mockSocketIo = function (port) {
            return stubbedIo;
        };

        mockery.registerAllowable('./server');
        mockery.registerMock('socket.io', mockSocketIo);
        mockery.enable({useCleanCache: true});

        biddingWarServer = require('./server');
    });

    afterEach(function() {
        mockery.deregisterAll();
        mockery.disable();
    });

    it('should call socket.emit loading', function () {
        var stubbedSocket = {
            emit: sinon.spy(),
        };
        stubbedIo.on = sinon.stub().callsArgWith(1, stubbedSocket);

        biddingWarServer.startServer();

        expect(stubbedSocket.emit.called).to.be.true;
    });

    it('should setup io.on connection', function () {
        stubbedIo.on = sinon.spy();

        biddingWarServer.startServer();

        expect(stubbedIo.on.called).to.be.true;
    });
});

<强> HTML

#hiddenDiv{
    margin:10px;
    padding:10px;
    width:200px;
    height:200px;
    background: red;
    display: none;
}

<强> JS

<div id="hiddenDiv"></div>
<button id="showDiv">Show it!</button>

<强> Fiddle

Answer 2

首先，您要定义一个_form_alter挂钩，因此请确保您只更改所需的表单，方法是检查$form_id的值，或者命名您的函数{{1} }。

提交表单通常会发送一个同步HTTP请求，该请求将产生重新加载。如果目标是覆盖它并改为具有AJAX行为，那么您应该查看Form API's #ajax property。

如果您的目标只是挂钩按钮点击事件，要在用户点击按钮和重新加载页面之间显示一个框（并且不阻止正常提交过程），那么您只需要插入一个新的Javascript文件，并执行类似

的操作

HOOK_form_FORM_ID_alter

如何在hook_form_alter方法中单击它时添加提交按钮并显示隐藏的<div>

2 个答案: